@vitejs/plugin-react 2.0.0-alpha.1 → 2.0.0-alpha.2

package/dist/index.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
+const path = require('path');
 const babel = require('@babel/core');
 const pluginutils = require('@rollup/pluginutils');
-const resolve = require('resolve');
+const vite = require('vite');
 const fs = require('fs');
-const path = require('path');
 const module$1 = require('module');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e["default"] : e; }
@@ -21,10 +21,9 @@ function _interopNamespace(e) {
   return n;
 }
 
+const path__default = /*#__PURE__*/_interopDefaultLegacy(path);
 const babel__namespace = /*#__PURE__*/_interopNamespace(babel);
-const resolve__default = /*#__PURE__*/_interopDefaultLegacy(resolve);
 const fs__default = /*#__PURE__*/_interopDefaultLegacy(fs);
-const path__default = /*#__PURE__*/_interopDefaultLegacy(path);
 
 const runtimePublicPath = "/@react-refresh";
 const _require = module$1.createRequire((typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('index.cjs', document.baseURI).href)));
@@ -140,9 +139,6 @@ async function getBabelRestoreJSX() {
   return babelRestoreJSX;
 }
 async function restoreJSX(babel, code, filename) {
-  if (filename.includes("/.vite/react-dom.js")) {
-    return jsxNotFound;
-  }
   const [reactAlias, isCommonJS] = parseReactAlias(code);
   if (!reactAlias) {
     return jsxNotFound;
@@ -189,24 +185,16 @@ function parseReactAlias(code) {
 }
 
 function viteReact(opts = {}) {
-  var _a;
   let base = "/";
+  let resolvedCacheDir;
   let filter = pluginutils.createFilter(opts.include, opts.exclude);
   let isProduction = true;
   let projectRoot = process.cwd();
   let skipFastRefresh = opts.fastRefresh === false;
   let skipReactImport = false;
+  let runPluginOverrides = (options, context) => false;
+  let staticBabelOptions;
   const useAutomaticRuntime = opts.jsxRuntime !== "classic";
-  const babelOptions = {
-    babelrc: false,
-    configFile: false,
-    ...opts.babel
-  };
-  babelOptions.plugins || (babelOptions.plugins = []);
-  babelOptions.presets || (babelOptions.presets = []);
-  babelOptions.overrides || (babelOptions.overrides = []);
-  babelOptions.parserOpts || (babelOptions.parserOpts = {});
-  (_a = babelOptions.parserOpts).plugins || (_a.plugins = []);
   const importReactRE = /(^|\n)import\s+(\*\s+as\s+)?React(,|\s+)/;
   const fileExtensionRE = /\.[^\/\s\?]+$/;
   const viteBabel = {
@@ -215,6 +203,7 @@ function viteReact(opts = {}) {
     configResolved(config) {
       base = config.base;
       projectRoot = config.root;
+      resolvedCacheDir = vite.normalizePath(path__default.resolve(config.cacheDir));
       filter = pluginutils.createFilter(opts.include, opts.exclude, {
         resolve: projectRoot
       });
@@ -229,10 +218,18 @@ function viteReact(opts = {}) {
         const hasConflict = plugin.name === "react-refresh" || plugin !== viteReactJsx && plugin.name === "vite:react-jsx";
         if (hasConflict)
           return config.logger.warn(`[@vitejs/plugin-react] You should stop using "${plugin.name}" since this plugin conflicts with it.`);
-        if (plugin.api?.reactBabel) {
-          plugin.api.reactBabel(babelOptions, config);
-        }
       });
+      runPluginOverrides = (babelOptions, context) => {
+        const hooks = config.plugins.map((plugin) => plugin.api?.reactBabel).filter(Boolean);
+        if (hooks.length > 0) {
+          return (runPluginOverrides = (babelOptions2) => {
+            hooks.forEach((hook) => hook(babelOptions2, context, config));
+            return true;
+          })(babelOptions);
+        }
+        runPluginOverrides = () => false;
+        return false;
+      };
     },
     async transform(code, id, options) {
       const ssr = typeof options === "boolean" ? options : options?.ssr === true;
@@ -242,6 +239,17 @@ function viteReact(opts = {}) {
         const isJSX = extension.endsWith("x");
         const isNodeModules = id.includes("/node_modules/");
         const isProjectFile = !isNodeModules && (id[0] === "\0" || id.startsWith(projectRoot + "/"));
+        let babelOptions = staticBabelOptions;
+        if (typeof opts.babel === "function") {
+          const rawOptions = opts.babel(id, { ssr });
+          babelOptions = createBabelOptions(rawOptions);
+          runPluginOverrides(babelOptions, { ssr, id });
+        } else if (!babelOptions) {
+          babelOptions = createBabelOptions(opts.babel);
+          if (!runPluginOverrides(babelOptions, { ssr, id })) {
+            staticBabelOptions = babelOptions;
+          }
+        }
         const plugins = isProjectFile ? [...babelOptions.plugins] : [];
         let useFastRefresh = false;
         if (!skipFastRefresh && !ssr && !isNodeModules) {
@@ -257,7 +265,8 @@ function viteReact(opts = {}) {
         let ast;
         if (!isProjectFile || isJSX) {
           if (useAutomaticRuntime) {
-            const [restoredAst, isCommonJS] = !isProjectFile && !isJSX ? await restoreJSX(babel__namespace, code, id) : [null, false];
+            const isOptimizedReactDom = id.startsWith(resolvedCacheDir) && id.includes("/react-dom.js");
+            const [restoredAst, isCommonJS] = !isProjectFile && !isJSX && !isOptimizedReactDom ? await restoreJSX(babel__namespace, code, id) : [null, false];
             if (isJSX || (ast = restoredAst)) {
               plugins.push([
                 await loadPlugin("@babel/plugin-transform-react-jsx" + (isProduction ? "" : "-development")),
@@ -363,7 +372,6 @@ function viteReact(opts = {}) {
         ];
     }
   };
-  const runtimeId = "react/jsx-runtime";
   const viteReactJsx = {
     name: "vite:react-jsx",
     enforce: "pre",
@@ -373,28 +381,27 @@ function viteReact(opts = {}) {
           include: ["react/jsx-dev-runtime"]
         }
       };
-    },
-    resolveId(id) {
-      return id === runtimeId ? id : null;
-    },
-    load(id) {
-      if (id === runtimeId) {
-        const runtimePath = resolve__default.sync(runtimeId, {
-          basedir: projectRoot
-        });
-        const exports = ["jsx", "jsxs", "Fragment"];
-        return [
-          `import * as jsxRuntime from ${JSON.stringify(runtimePath)}`,
-          ...exports.map((name) => `export const ${name} = jsxRuntime.${name}`)
-        ].join("\n");
-      }
     }
   };
   return [viteBabel, viteReactRefresh, useAutomaticRuntime && viteReactJsx];
 }
 viteReact.preambleCode = preambleCode;
-function loadPlugin(path) {
-  return import(path).then((module) => module.default || module);
+function loadPlugin(path2) {
+  return import(path2).then((module) => module.default || module);
+}
+function createBabelOptions(rawOptions) {
+  var _a;
+  const babelOptions = {
+    babelrc: false,
+    configFile: false,
+    ...rawOptions
+  };
+  babelOptions.plugins || (babelOptions.plugins = []);
+  babelOptions.presets || (babelOptions.presets = []);
+  babelOptions.overrides || (babelOptions.overrides = []);
+  babelOptions.parserOpts || (babelOptions.parserOpts = {});
+  (_a = babelOptions.parserOpts).plugins || (_a.plugins = []);
+  return babelOptions;
 }
 
 module.exports = viteReact;

package/dist/index.d.ts

@@ -29,7 +29,9 @@ interface Options {
     /**
      * Babel configuration applied in both dev and prod.
      */
-    babel?: BabelOptions;
+    babel?: BabelOptions | ((id: string, options: {
+        ssr?: boolean;
+    }) => BabelOptions);
 }
 declare type BabelOptions = Omit<TransformOptions, 'ast' | 'filename' | 'root' | 'sourceFileName' | 'sourceMaps' | 'inputSourceMap'>;
 /**
@@ -44,13 +46,18 @@ interface ReactBabelOptions extends BabelOptions {
         plugins: Extract<ParserOptions['plugins'], any[]>;
     };
 }
+declare type ReactBabelHook = (babelConfig: ReactBabelOptions, context: ReactBabelHookContext, config: ResolvedConfig) => void;
+declare type ReactBabelHookContext = {
+    ssr: boolean;
+    id: string;
+};
 declare module 'vite' {
     interface Plugin {
         api?: {
             /**
              * Manipulate the Babel options of `@vitejs/plugin-react`
              */
-            reactBabel?: (options: ReactBabelOptions, config: ResolvedConfig) => void;
+            reactBabel?: ReactBabelHook;
         };
     }
 }

package/dist/index.mjs

@@ -1,8 +1,8 @@
+import path from 'path';
 import * as babel from '@babel/core';
 import { createFilter } from '@rollup/pluginutils';
-import resolve from 'resolve';
+import { normalizePath } from 'vite';
 import fs from 'fs';
-import path from 'path';
 import { createRequire } from 'module';
 
 const runtimePublicPath = "/@react-refresh";
@@ -119,9 +119,6 @@ async function getBabelRestoreJSX() {
   return babelRestoreJSX;
 }
 async function restoreJSX(babel, code, filename) {
-  if (filename.includes("/.vite/react-dom.js")) {
-    return jsxNotFound;
-  }
   const [reactAlias, isCommonJS] = parseReactAlias(code);
   if (!reactAlias) {
     return jsxNotFound;
@@ -168,24 +165,16 @@ function parseReactAlias(code) {
 }
 
 function viteReact(opts = {}) {
-  var _a;
   let base = "/";
+  let resolvedCacheDir;
   let filter = createFilter(opts.include, opts.exclude);
   let isProduction = true;
   let projectRoot = process.cwd();
   let skipFastRefresh = opts.fastRefresh === false;
   let skipReactImport = false;
+  let runPluginOverrides = (options, context) => false;
+  let staticBabelOptions;
   const useAutomaticRuntime = opts.jsxRuntime !== "classic";
-  const babelOptions = {
-    babelrc: false,
-    configFile: false,
-    ...opts.babel
-  };
-  babelOptions.plugins || (babelOptions.plugins = []);
-  babelOptions.presets || (babelOptions.presets = []);
-  babelOptions.overrides || (babelOptions.overrides = []);
-  babelOptions.parserOpts || (babelOptions.parserOpts = {});
-  (_a = babelOptions.parserOpts).plugins || (_a.plugins = []);
   const importReactRE = /(^|\n)import\s+(\*\s+as\s+)?React(,|\s+)/;
   const fileExtensionRE = /\.[^\/\s\?]+$/;
   const viteBabel = {
@@ -194,6 +183,7 @@ function viteReact(opts = {}) {
     configResolved(config) {
       base = config.base;
       projectRoot = config.root;
+      resolvedCacheDir = normalizePath(path.resolve(config.cacheDir));
       filter = createFilter(opts.include, opts.exclude, {
         resolve: projectRoot
       });
@@ -208,10 +198,18 @@ function viteReact(opts = {}) {
         const hasConflict = plugin.name === "react-refresh" || plugin !== viteReactJsx && plugin.name === "vite:react-jsx";
         if (hasConflict)
           return config.logger.warn(`[@vitejs/plugin-react] You should stop using "${plugin.name}" since this plugin conflicts with it.`);
-        if (plugin.api?.reactBabel) {
-          plugin.api.reactBabel(babelOptions, config);
-        }
       });
+      runPluginOverrides = (babelOptions, context) => {
+        const hooks = config.plugins.map((plugin) => plugin.api?.reactBabel).filter(Boolean);
+        if (hooks.length > 0) {
+          return (runPluginOverrides = (babelOptions2) => {
+            hooks.forEach((hook) => hook(babelOptions2, context, config));
+            return true;
+          })(babelOptions);
+        }
+        runPluginOverrides = () => false;
+        return false;
+      };
     },
     async transform(code, id, options) {
       const ssr = typeof options === "boolean" ? options : options?.ssr === true;
@@ -221,6 +219,17 @@ function viteReact(opts = {}) {
         const isJSX = extension.endsWith("x");
         const isNodeModules = id.includes("/node_modules/");
         const isProjectFile = !isNodeModules && (id[0] === "\0" || id.startsWith(projectRoot + "/"));
+        let babelOptions = staticBabelOptions;
+        if (typeof opts.babel === "function") {
+          const rawOptions = opts.babel(id, { ssr });
+          babelOptions = createBabelOptions(rawOptions);
+          runPluginOverrides(babelOptions, { ssr, id });
+        } else if (!babelOptions) {
+          babelOptions = createBabelOptions(opts.babel);
+          if (!runPluginOverrides(babelOptions, { ssr, id })) {
+            staticBabelOptions = babelOptions;
+          }
+        }
         const plugins = isProjectFile ? [...babelOptions.plugins] : [];
         let useFastRefresh = false;
         if (!skipFastRefresh && !ssr && !isNodeModules) {
@@ -236,7 +245,8 @@ function viteReact(opts = {}) {
         let ast;
         if (!isProjectFile || isJSX) {
           if (useAutomaticRuntime) {
-            const [restoredAst, isCommonJS] = !isProjectFile && !isJSX ? await restoreJSX(babel, code, id) : [null, false];
+            const isOptimizedReactDom = id.startsWith(resolvedCacheDir) && id.includes("/react-dom.js");
+            const [restoredAst, isCommonJS] = !isProjectFile && !isJSX && !isOptimizedReactDom ? await restoreJSX(babel, code, id) : [null, false];
             if (isJSX || (ast = restoredAst)) {
               plugins.push([
                 await loadPlugin("@babel/plugin-transform-react-jsx" + (isProduction ? "" : "-development")),
@@ -342,7 +352,6 @@ function viteReact(opts = {}) {
         ];
     }
   };
-  const runtimeId = "react/jsx-runtime";
   const viteReactJsx = {
     name: "vite:react-jsx",
     enforce: "pre",
@@ -352,28 +361,27 @@ function viteReact(opts = {}) {
           include: ["react/jsx-dev-runtime"]
         }
       };
-    },
-    resolveId(id) {
-      return id === runtimeId ? id : null;
-    },
-    load(id) {
-      if (id === runtimeId) {
-        const runtimePath = resolve.sync(runtimeId, {
-          basedir: projectRoot
-        });
-        const exports = ["jsx", "jsxs", "Fragment"];
-        return [
-          `import * as jsxRuntime from ${JSON.stringify(runtimePath)}`,
-          ...exports.map((name) => `export const ${name} = jsxRuntime.${name}`)
-        ].join("\n");
-      }
     }
   };
   return [viteBabel, viteReactRefresh, useAutomaticRuntime && viteReactJsx];
 }
 viteReact.preambleCode = preambleCode;
-function loadPlugin(path) {
-  return import(path).then((module) => module.default || module);
+function loadPlugin(path2) {
+  return import(path2).then((module) => module.default || module);
+}
+function createBabelOptions(rawOptions) {
+  var _a;
+  const babelOptions = {
+    babelrc: false,
+    configFile: false,
+    ...rawOptions
+  };
+  babelOptions.plugins || (babelOptions.plugins = []);
+  babelOptions.presets || (babelOptions.presets = []);
+  babelOptions.overrides || (babelOptions.overrides = []);
+  babelOptions.parserOpts || (babelOptions.parserOpts = {});
+  (_a = babelOptions.parserOpts).plugins || (_a.plugins = []);
+  return babelOptions;
 }
 
 export { viteReact as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitejs/plugin-react",
-  "version": "2.0.0-alpha.1",
+  "version": "2.0.0-alpha.2",
   "license": "MIT",
   "author": "Evan You",
   "contributors": [
@@ -23,7 +23,7 @@
   "scripts": {
     "dev": "unbuild --stub",
     "build": "unbuild && pnpm run patch-cjs",
-    "patch-cjs": "ts-node ../../scripts/patchCJS.ts",
+    "patch-cjs": "esno ../../scripts/patchCJS.ts",
     "prepublishOnly": "npm run build"
   },
   "engines": {
@@ -39,10 +39,10 @@
   },
   "homepage": "https://github.com/vitejs/vite/tree/main/packages/plugin-react#readme",
   "dependencies": {
-    "@babel/core": "^7.17.10",
-    "@babel/plugin-transform-react-jsx": "^7.17.3",
+    "@babel/core": "^7.18.0",
+    "@babel/plugin-transform-react-jsx": "^7.17.12",
     "@babel/plugin-transform-react-jsx-development": "^7.16.7",
-    "@babel/plugin-transform-react-jsx-self": "^7.16.7",
+    "@babel/plugin-transform-react-jsx-self": "^7.17.12",
     "@babel/plugin-transform-react-jsx-source": "^7.16.7",
     "@rollup/pluginutils": "^4.2.1",
     "react-refresh": "^0.13.0",

package/src/index.ts

@@ -1,7 +1,8 @@
+import path from 'path'
 import type { ParserOptions, TransformOptions, types as t } from '@babel/core'
 import * as babel from '@babel/core'
 import { createFilter } from '@rollup/pluginutils'
-import resolve from 'resolve'
+import { normalizePath } from 'vite'
 import type { Plugin, PluginOption, ResolvedConfig } from 'vite'
 import {
   addRefreshWrapper,
@@ -41,7 +42,9 @@ export interface Options {
   /**
    * Babel configuration applied in both dev and prod.
    */
-  babel?: BabelOptions
+  babel?:
+    | BabelOptions
+    | ((id: string, options: { ssr?: boolean }) => BabelOptions)
 }
 
 export type BabelOptions = Omit<
@@ -67,13 +70,21 @@ export interface ReactBabelOptions extends BabelOptions {
   }
 }
 
+type ReactBabelHook = (
+  babelConfig: ReactBabelOptions,
+  context: ReactBabelHookContext,
+  config: ResolvedConfig
+) => void
+
+type ReactBabelHookContext = { ssr: boolean; id: string }
+
 declare module 'vite' {
   export interface Plugin {
     api?: {
       /**
        * Manipulate the Babel options of `@vitejs/plugin-react`
        */
-      reactBabel?: (options: ReactBabelOptions, config: ResolvedConfig) => void
+      reactBabel?: ReactBabelHook
     }
   }
 }
@@ -81,26 +92,20 @@ declare module 'vite' {
 export default function viteReact(opts: Options = {}): PluginOption[] {
   // Provide default values for Rollup compat.
   let base = '/'
+  let resolvedCacheDir: string
   let filter = createFilter(opts.include, opts.exclude)
   let isProduction = true
   let projectRoot = process.cwd()
   let skipFastRefresh = opts.fastRefresh === false
   let skipReactImport = false
+  let runPluginOverrides = (
+    options: ReactBabelOptions,
+    context: ReactBabelHookContext
+  ) => false
+  let staticBabelOptions: ReactBabelOptions | undefined
 
   const useAutomaticRuntime = opts.jsxRuntime !== 'classic'
 
-  const babelOptions = {
-    babelrc: false,
-    configFile: false,
-    ...opts.babel
-  } as ReactBabelOptions
-
-  babelOptions.plugins ||= []
-  babelOptions.presets ||= []
-  babelOptions.overrides ||= []
-  babelOptions.parserOpts ||= {} as any
-  babelOptions.parserOpts.plugins ||= []
-
   // Support patterns like:
   // - import * as React from 'react';
   // - import React from 'react';
@@ -116,6 +121,7 @@ export default function viteReact(opts: Options = {}): PluginOption[] {
     configResolved(config) {
       base = config.base
       projectRoot = config.root
+      resolvedCacheDir = normalizePath(path.resolve(config.cacheDir))
       filter = createFilter(opts.include, opts.exclude, {
         resolve: projectRoot
       })
@@ -141,11 +147,22 @@ export default function viteReact(opts: Options = {}): PluginOption[] {
             `[@vitejs/plugin-react] You should stop using "${plugin.name}" ` +
               `since this plugin conflicts with it.`
           )
+      })
+
+      runPluginOverrides = (babelOptions, context) => {
+        const hooks = config.plugins
+          .map((plugin) => plugin.api?.reactBabel)
+          .filter(Boolean) as ReactBabelHook[]
 
-        if (plugin.api?.reactBabel) {
-          plugin.api.reactBabel(babelOptions, config)
+        if (hooks.length > 0) {
+          return (runPluginOverrides = (babelOptions) => {
+            hooks.forEach((hook) => hook(babelOptions, context, config))
+            return true
+          })(babelOptions)
         }
-      })
+        runPluginOverrides = () => false
+        return false
+      }
     },
     async transform(code, id, options) {
       const ssr = typeof options === 'boolean' ? options : options?.ssr === true
@@ -162,6 +179,18 @@ export default function viteReact(opts: Options = {}): PluginOption[] {
         const isProjectFile =
           !isNodeModules && (id[0] === '\0' || id.startsWith(projectRoot + '/'))
 
+        let babelOptions = staticBabelOptions
+        if (typeof opts.babel === 'function') {
+          const rawOptions = opts.babel(id, { ssr })
+          babelOptions = createBabelOptions(rawOptions)
+          runPluginOverrides(babelOptions, { ssr, id: id })
+        } else if (!babelOptions) {
+          babelOptions = createBabelOptions(opts.babel)
+          if (!runPluginOverrides(babelOptions, { ssr, id: id })) {
+            staticBabelOptions = babelOptions
+          }
+        }
+
         const plugins = isProjectFile ? [...babelOptions.plugins] : []
 
         let useFastRefresh = false
@@ -183,8 +212,12 @@ export default function viteReact(opts: Options = {}): PluginOption[] {
             // By reverse-compiling "React.createElement" calls into JSX,
             // React elements provided by dependencies will also use the
             // automatic runtime!
+            // Avoid parsing the optimized react-dom since it will never
+            // contain compiled JSX and it's a pretty big file (800kb).
+            const isOptimizedReactDom =
+              id.startsWith(resolvedCacheDir) && id.includes('/react-dom.js')
             const [restoredAst, isCommonJS] =
-              !isProjectFile && !isJSX
+              !isProjectFile && !isJSX && !isOptimizedReactDom
                 ? await restoreJSX(babel, code, id)
                 : [null, false]
 
@@ -328,7 +361,7 @@ export default function viteReact(opts: Options = {}): PluginOption[] {
     }
   }
 
-  const runtimeId = 'react/jsx-runtime'
+  // const runtimeId = 'react/jsx-runtime'
   // Adapted from https://github.com/alloc/vite-react-jsx
   const viteReactJsx: Plugin = {
     name: 'vite:react-jsx',
@@ -339,10 +372,14 @@ export default function viteReact(opts: Options = {}): PluginOption[] {
           include: ['react/jsx-dev-runtime']
         }
       }
-    },
+    }
+    // TODO: this optimization may not be necesary and it is breacking esbuild+rollup compat,
+    // see https://github.com/vitejs/vite/pull/7246#discussion_r861552185
+    // We could still do the same trick and resolve to the optimized dependency here
+    /*
     resolveId(id: string) {
       return id === runtimeId ? id : null
-    },
+    }, 
     load(id: string) {
       if (id === runtimeId) {
         const runtimePath = resolve.sync(runtimeId, {
@@ -357,7 +394,7 @@ export default function viteReact(opts: Options = {}): PluginOption[] {
           ...exports.map((name) => `export const ${name} = jsxRuntime.${name}`)
         ].join('\n')
       }
-    }
+    } */
   }
 
   return [viteBabel, viteReactRefresh, useAutomaticRuntime && viteReactJsx]
@@ -368,3 +405,19 @@ viteReact.preambleCode = preambleCode
 function loadPlugin(path: string): Promise<any> {
   return import(path).then((module) => module.default || module)
 }
+
+function createBabelOptions(rawOptions?: BabelOptions) {
+  const babelOptions = {
+    babelrc: false,
+    configFile: false,
+    ...rawOptions
+  } as ReactBabelOptions
+
+  babelOptions.plugins ||= []
+  babelOptions.presets ||= []
+  babelOptions.overrides ||= []
+  babelOptions.parserOpts ||= {} as any
+  babelOptions.parserOpts.plugins ||= []
+
+  return babelOptions
+}

package/src/jsx-runtime/restore-jsx.ts

@@ -27,12 +27,6 @@ export async function restoreJSX(
   code: string,
   filename: string
 ): Promise<RestoredJSX> {
-  // Avoid parsing the optimized react-dom since it will never
-  // contain compiled JSX and it's a pretty big file (800kb).
-  if (filename.includes('/.vite/react-dom.js')) {
-    return jsxNotFound
-  }
-
   const [reactAlias, isCommonJS] = parseReactAlias(code)
 
   if (!reactAlias) {