From 9baa70b788ec0b0fc419db30d627567242c6af7d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=BF=A0=20/=20green?= <green@sapphi.red>
Date: Thu, 19 May 2022 10:23:45 +0900
Subject: [PATCH] fix: rewrite CJS specific funcs/vars in plugins (#8227)

---
 .eslintrc.cjs                             | 6 ++++++
 packages/plugin-legacy/src/index.ts       | 7 +++++--
 packages/plugin-legacy/tsconfig.json      | 2 +-
 packages/plugin-react/src/fast-refresh.ts | 4 +++-
 packages/plugin-react/tsconfig.json       | 2 +-
 packages/plugin-vue-jsx/src/index.ts      | 7 +++++--
 packages/plugin-vue-jsx/tsconfig.json     | 2 +-
 packages/plugin-vue/src/compiler.ts       | 6 +++++-
 packages/plugin-vue/tsconfig.json         | 2 +-
 9 files changed, 28 insertions(+), 10 deletions(-)

diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index 67dcb7209c6e2a..f6db9c4b4cbc5c 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -115,6 +115,12 @@ module.exports = defineConfig({
         'node/no-extraneous-import': 'off'
       }
     },
+    {
+      files: ['packages/plugin-*/**/*'],
+      rules: {
+        'no-restricted-globals': ['error', 'require', '__dirname', '__filename']
+      }
+    },
     {
       files: ['playground/**'],
       rules: {
diff --git a/packages/plugin-legacy/src/index.ts b/packages/plugin-legacy/src/index.ts
index 8bd3c6811f6a9b..dd0cf13dc81d16 100644
--- a/packages/plugin-legacy/src/index.ts
+++ b/packages/plugin-legacy/src/index.ts
@@ -1,6 +1,8 @@
 /* eslint-disable node/no-extraneous-import */
 import path from 'path'
 import { createHash } from 'crypto'
+import { createRequire } from 'module'
+import { fileURLToPath } from 'url'
 import { build } from 'vite'
 import MagicString from 'magic-string'
 import type {
@@ -171,6 +173,7 @@ function viteLegacyPlugin(options: Options = {}): Plugin[] {
     }
   }
 
+  const _require = createRequire(import.meta.url)
   const legacyPostPlugin: Plugin = {
     name: 'vite:legacy-post-process',
     enforce: 'post',
@@ -331,7 +334,7 @@ function viteLegacyPlugin(options: Options = {}): Plugin[] {
               useBuiltIns: needPolyfills ? 'usage' : false,
               corejs: needPolyfills
                 ? {
-                    version: require('core-js/package.json').version,
+                    version: _require('core-js/package.json').version,
                     proposals: false
                   }
                 : undefined,
@@ -557,7 +560,7 @@ async function buildPolyfillChunk(
   minify = minify ? 'terser' : false
   const res = await build({
     // so that everything is resolved from here
-    root: __dirname,
+    root: path.dirname(fileURLToPath(import.meta.url)),
     configFile: false,
     logLevel: 'error',
     plugins: [polyfillsPlugin(imports, externalSystemJS)],
diff --git a/packages/plugin-legacy/tsconfig.json b/packages/plugin-legacy/tsconfig.json
index 0068f94384be8f..ddb60f864b7e6d 100644
--- a/packages/plugin-legacy/tsconfig.json
+++ b/packages/plugin-legacy/tsconfig.json
@@ -4,7 +4,7 @@
   "compilerOptions": {
     "outDir": "dist",
     "target": "ES2020",
-    "module": "CommonJS",
+    "module": "ES2020",
     "moduleResolution": "Node",
     "strict": true,
     "declaration": true,
diff --git a/packages/plugin-react/src/fast-refresh.ts b/packages/plugin-react/src/fast-refresh.ts
index 6bff7d94fa023b..708021f28a2665 100644
--- a/packages/plugin-react/src/fast-refresh.ts
+++ b/packages/plugin-react/src/fast-refresh.ts
@@ -1,11 +1,13 @@
 import fs from 'fs'
 import path from 'path'
+import { createRequire } from 'module'
 import type { types as t } from '@babel/core'
 
 export const runtimePublicPath = '/@react-refresh'
 
+const _require = createRequire(import.meta.url)
 const reactRefreshDir = path.dirname(
-  require.resolve('react-refresh/package.json')
+  _require.resolve('react-refresh/package.json')
 )
 const runtimeFilePath = path.join(
   reactRefreshDir,
diff --git a/packages/plugin-react/tsconfig.json b/packages/plugin-react/tsconfig.json
index 0068f94384be8f..ddb60f864b7e6d 100644
--- a/packages/plugin-react/tsconfig.json
+++ b/packages/plugin-react/tsconfig.json
@@ -4,7 +4,7 @@
   "compilerOptions": {
     "outDir": "dist",
     "target": "ES2020",
-    "module": "CommonJS",
+    "module": "ES2020",
     "moduleResolution": "Node",
     "strict": true,
     "declaration": true,
diff --git a/packages/plugin-vue-jsx/src/index.ts b/packages/plugin-vue-jsx/src/index.ts
index e23f0031b69bd1..c96fe2964e83b0 100644
--- a/packages/plugin-vue-jsx/src/index.ts
+++ b/packages/plugin-vue-jsx/src/index.ts
@@ -73,7 +73,7 @@ function vueJsxPlugin(options: Options = {}): Plugin {
       }
     },
 
-    transform(code, id, opt) {
+    async transform(code, id, opt) {
       const ssr = typeof opt === 'boolean' ? opt : (opt && opt.ssr) === true
       const {
         include,
@@ -91,7 +91,10 @@ function vueJsxPlugin(options: Options = {}): Plugin {
         const plugins = [importMeta, [jsx, babelPluginOptions], ...babelPlugins]
         if (id.endsWith('.tsx') || filepath.endsWith('.tsx')) {
           plugins.push([
-            require('@babel/plugin-transform-typescript'),
+            // @ts-ignore missing type
+            await import('@babel/plugin-transform-typescript').then(
+              (r) => r.default
+            ),
             // @ts-ignore
             { isTSX: true, allowExtensions: true }
           ])
diff --git a/packages/plugin-vue-jsx/tsconfig.json b/packages/plugin-vue-jsx/tsconfig.json
index 0068f94384be8f..ddb60f864b7e6d 100644
--- a/packages/plugin-vue-jsx/tsconfig.json
+++ b/packages/plugin-vue-jsx/tsconfig.json
@@ -4,7 +4,7 @@
   "compilerOptions": {
     "outDir": "dist",
     "target": "ES2020",
-    "module": "CommonJS",
+    "module": "ES2020",
     "moduleResolution": "Node",
     "strict": true,
     "declaration": true,
diff --git a/packages/plugin-vue/src/compiler.ts b/packages/plugin-vue/src/compiler.ts
index 9c70f6a8a64590..f4a24b1ea95005 100644
--- a/packages/plugin-vue/src/compiler.ts
+++ b/packages/plugin-vue/src/compiler.ts
@@ -5,6 +5,7 @@ declare module 'vue/compiler-sfc' {
   }
 }
 
+import { createRequire } from 'module'
 import type * as _compiler from 'vue/compiler-sfc'
 
 export function resolveCompiler(root: string): typeof _compiler {
@@ -23,8 +24,11 @@ export function resolveCompiler(root: string): typeof _compiler {
   return compiler
 }
 
+const _require = createRequire(import.meta.url)
 function tryRequire(id: string, from?: string) {
   try {
-    return from ? require(require.resolve(id, { paths: [from] })) : require(id)
+    return from
+      ? _require(_require.resolve(id, { paths: [from] }))
+      : _require(id)
   } catch (e) {}
 }
diff --git a/packages/plugin-vue/tsconfig.json b/packages/plugin-vue/tsconfig.json
index ca2267f0bf3c35..d3a45a1b69dbd3 100644
--- a/packages/plugin-vue/tsconfig.json
+++ b/packages/plugin-vue/tsconfig.json
@@ -4,7 +4,7 @@
   "compilerOptions": {
     "outDir": "dist",
     "target": "ES2020",
-    "module": "commonjs",
+    "module": "ES2020",
     "moduleResolution": "node",
     "strict": true,
     "declaration": true,