feat!: move to ESM first with dual esm/cjs package exports (#720)

* feat!: move to ESM first with dual esm/cjs package exports

* docs: update readme for webpack, vue-cli, rspack and esbuild

* chore: include only code snippets for the latest version

Author: userquin

README.md

@@ -74,7 +74,7 @@ export default {
 module.exports = {
   /* ... */
   plugins: [
-    require('unplugin-vue-components/webpack')({ /* options */ }),
+    require('unplugin-vue-components/webpack').default({ /* options */ }),
   ],
 }
 ```
@@ -89,7 +89,7 @@ module.exports = {
 module.exports = {
   /* ... */
   plugins: [
-    require('unplugin-vue-components/rspack')({ /* options */ }),
+    require('unplugin-vue-components/rspack').default({ /* options */ }),
   ],
 }
 ```
@@ -109,9 +109,22 @@ You might not need this plugin for Nuxt. Use [`@nuxt/components`](https://github
 ```ts
 // vue.config.js
 module.exports = {
+  /* ... */
+  plugins: [
+    require('unplugin-vue-components/webpack').default({ /* options */ }),
+  ],
+}
+```
+
+You can also rename the Vue configuration file to `vue.config.mjs` and use static import syntax (you should use latest `@vue/cli-service ^5.0.8`):
+```ts
+// vue.config.mjs
+import Components from 'unplugin-vue-components/webpack'
+
+export default {
   configureWebpack: {
     plugins: [
-      require('unplugin-vue-components/webpack')({ /* options */ }),
+      Components({ /* options */ }),
     ],
   },
 }
@@ -125,11 +138,12 @@ module.exports = {
 ```ts
 // esbuild.config.js
 import { build } from 'esbuild'
+import Components from 'unplugin-vue-components/esbuild'
 
 build({
   /* ... */
   plugins: [
-    require('unplugin-vue-components/esbuild')({
+    Components({
       /* options */
     }),
   ],

package.json

@@ -1,5 +1,6 @@
 {
   "name": "unplugin-vue-components",
+  "type": "module",
   "version": "0.25.4",
   "packageManager": "[email protected]",
   "description": "Components auto importing for Vue",
@@ -14,54 +15,45 @@
   "bugs": "https://github.com/unplugin/unplugin-vue-components/issues",
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js"
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
     },
     "./nuxt": {
-      "types": "./dist/nuxt.d.ts",
-      "import": "./dist/nuxt.mjs",
-      "require": "./dist/nuxt.js"
+      "import": "./dist/nuxt.js",
+      "require": "./dist/nuxt.cjs"
     },
     "./resolvers": {
-      "types": "./dist/resolvers.d.ts",
-      "import": "./dist/resolvers.mjs",
-      "require": "./dist/resolvers.js"
+      "import": "./dist/resolvers.js",
+      "require": "./dist/resolvers.cjs"
     },
     "./rollup": {
-      "types": "./dist/rollup.d.ts",
-      "import": "./dist/rollup.mjs",
-      "require": "./dist/rollup.js"
+      "import": "./dist/rollup.js",
+      "require": "./dist/rollup.cjs"
     },
     "./types": {
-      "types": "./dist/types.d.ts",
-      "import": "./dist/types.mjs",
-      "require": "./dist/types.js"
+      "import": "./dist/types.js",
+      "require": "./dist/types.cjs"
     },
     "./vite": {
-      "types": "./dist/vite.d.ts",
-      "import": "./dist/vite.mjs",
-      "require": "./dist/vite.js"
+      "import": "./dist/vite.js",
+      "require": "./dist/vite.cjs"
     },
     "./webpack": {
-      "types": "./dist/webpack.d.ts",
-      "import": "./dist/webpack.mjs",
-      "require": "./dist/webpack.js"
+      "import": "./dist/webpack.js",
+      "require": "./dist/webpack.cjs"
     },
     "./rspack": {
-      "types": "./dist/rspack.d.ts",
-      "import": "./dist/rspack.mjs",
-      "require": "./dist/rspack.js"
+      "import": "./dist/rspack.js",
+      "require": "./dist/rspack.cjs"
     },
     "./esbuild": {
-      "types": "./dist/esbuild.d.ts",
-      "import": "./dist/esbuild.mjs",
-      "require": "./dist/esbuild.js"
+      "import": "./dist/esbuild.js",
+      "require": "./dist/esbuild.cjs"
     },
     "./*": "./*"
   },
-  "main": "dist/index.js",
-  "module": "dist/index.mjs",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
   "types": "index.d.ts",
   "typesVersions": {
     "*": {
@@ -77,7 +69,7 @@
     "node": ">=14"
   },
   "scripts": {
-    "build": "tsup && esno scripts/postbuild.ts",
+    "build": "tsup",
     "dev": "tsup --watch src",
     "example:build": "npm -C examples/vite-vue3 run build",
     "example:dev": "npm -C examples/vite-vue3 run dev",