feat!: migrate to ESM (#8178)

.eslintrc.cjs

@@ -148,6 +148,12 @@ module.exports = defineConfig({
       rules: {
         '@typescript-eslint/triple-slash-reference': 'off'
       }
+    },
+    {
+      files: 'packages/vite/**/*.*',
+      rules: {
+        'no-restricted-globals': ['error', 'require', '__dirname', '__filename']
+      }
     }
   ]
 })

package.json

@@ -77,6 +77,7 @@
     "prompts": "^2.4.2",
     "rimraf": "^3.0.2",
     "rollup": "^2.72.1",
+    "rollup-plugin-esbuild": "^4.9.1",
     "semver": "^7.3.7",
     "simple-git-hooks": "^2.7.0",
     "sirv": "^2.0.2",

packages/plugin-vue-jsx/src/index.ts

@@ -1,7 +1,7 @@
 import { createHash } from 'crypto'
 import path from 'path'
 import type { types } from '@babel/core'
-import babel from '@babel/core'
+import * as babel from '@babel/core'
 import jsx from '@vue/babel-plugin-jsx'
 // @ts-expect-error missing type
 import importMeta from '@babel/plugin-syntax-import-meta'

packages/plugin-vue/src/style.ts

@@ -51,7 +51,7 @@ export async function transformStyle(
   }
 
   const map = result.map
-    ? formatPostcssSourceMap(
+    ? await formatPostcssSourceMap(
         // version property of result.map is declared as string
         // but actually it is a number
         result.map as Omit<RawSourceMap, 'version'> as ExistingRawSourceMap,

playground/vitestSetup.ts

@@ -161,7 +161,7 @@ export async function startDefaultServe() {
   let config: InlineConfig | undefined
   if (fs.existsSync(testCustomConfig)) {
     // test has custom server configuration.
-    config = require(testCustomConfig)
+    config = await import(testCustomConfig).then((r) => r.default)
   }
 
   const options: InlineConfig = {

playground/vue-sourcemap/__tests__/serve.spec.ts

@@ -15,7 +15,7 @@ describe.runIf(isServe)('serve:vue-sourcemap', () => {
         return text
       }
     }
-    throw new Error('Not found')
+    throw new Error('Style not found: ' + content)
   }
 
   test('js', async () => {