@vitejs/plugin-react 4.7.0 → 5.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -21,7 +21,7 @@ export default defineConfig({
21
21
 
22
22
  ### include/exclude
23
23
 
24
- Includes `.js`, `.jsx`, `.ts` & `.tsx` by default. This option can be used to add fast refresh to `.mdx` files:
24
+ Includes `.js`, `.jsx`, `.ts` & `.tsx` and excludes `/node_modules/` by default. This option can be used to add fast refresh to `.mdx` files:
25
25
 
26
26
  ```js
27
27
  import { defineConfig } from 'vite'
@@ -36,8 +36,6 @@ export default defineConfig({
36
36
  })
37
37
  ```
38
38
 
39
- > `node_modules` are never processed by this plugin (but esbuild will)
40
-
41
39
  ### jsxImportSource
42
40
 
43
41
  Control where the JSX factory is imported from. Default to `'react'`
package/dist/index.d.ts CHANGED
@@ -30,10 +30,6 @@ interface Options {
30
30
  * reactRefreshHost: 'http://localhost:3000'
31
31
  */
32
32
  reactRefreshHost?: string;
33
- /**
34
- * If set, disables the recommendation to use `@vitejs/plugin-react-oxc`
35
- */
36
- disableOxcRecommendation?: boolean;
37
33
  }
38
34
  type BabelOptions = Omit<TransformOptions, 'ast' | 'filename' | 'root' | 'sourceFileName' | 'sourceMaps' | 'inputSourceMap'>;
39
35
  /**
@@ -63,5 +59,6 @@ declare function viteReact(opts?: Options): Plugin[];
63
59
  declare namespace viteReact {
64
60
  var preambleCode: string;
65
61
  }
62
+ declare function viteReactForCjs(this: unknown, options: Options): Plugin[];
66
63
  //#endregion
67
- export { BabelOptions, Options, ReactBabelOptions, ViteReactPluginApi, viteReact as default };
64
+ export { BabelOptions, Options, ReactBabelOptions, ViteReactPluginApi, viteReact as default, viteReactForCjs as "module.exports" };
package/dist/index.js CHANGED
@@ -83,10 +83,9 @@ function removeLineBreaksIfNeeded(code, enabled) {
83
83
  //#endregion
84
84
  //#region ../common/warning.ts
85
85
  const silenceUseClientWarning = (userConfig) => ({ rollupOptions: { onwarn(warning, defaultHandler) {
86
- var _userConfig$build;
87
86
  if (warning.code === "MODULE_LEVEL_DIRECTIVE" && (warning.message.includes("use client") || warning.message.includes("use server"))) return;
88
87
  if (warning.code === "SOURCEMAP_ERROR" && warning.message.includes("resolve original location") && warning.pos === 0) return;
89
- if ((_userConfig$build = userConfig.build) === null || _userConfig$build === void 0 || (_userConfig$build = _userConfig$build.rollupOptions) === null || _userConfig$build === void 0 ? void 0 : _userConfig$build.onwarn) userConfig.build.rollupOptions.onwarn(warning, defaultHandler);
88
+ if (userConfig.build?.rollupOptions?.onwarn) userConfig.build.rollupOptions.onwarn(warning, defaultHandler);
90
89
  else defaultHandler(warning);
91
90
  } } });
92
91
 
@@ -100,15 +99,16 @@ async function loadBabel() {
100
99
  return babel;
101
100
  }
102
101
  const defaultIncludeRE = /\.[tj]sx?$/;
102
+ const defaultExcludeRE = /\/node_modules\//;
103
103
  const tsRE = /\.tsx?$/;
104
104
  function viteReact(opts = {}) {
105
- var _opts$babel;
106
105
  const include = opts.include ?? defaultIncludeRE;
107
- const exclude = opts.exclude;
106
+ const exclude = opts.exclude ?? defaultExcludeRE;
108
107
  const filter = createFilter(include, exclude);
109
108
  const jsxImportSource = opts.jsxImportSource ?? "react";
110
109
  const jsxImportRuntime = `${jsxImportSource}/jsx-runtime`;
111
110
  const jsxImportDevRuntime = `${jsxImportSource}/jsx-dev-runtime`;
111
+ const isRolldownVite = "rolldownVersion" in vite;
112
112
  let runningInVite = false;
113
113
  let isProduction = true;
114
114
  let projectRoot = process.cwd();
@@ -119,18 +119,35 @@ function viteReact(opts = {}) {
119
119
  const viteBabel = {
120
120
  name: "vite:react-babel",
121
121
  enforce: "pre",
122
- config() {
123
- if (opts.jsxRuntime === "classic") if ("rolldownVersion" in vite) return { oxc: { jsx: {
124
- runtime: "classic",
125
- development: false
126
- } } };
127
- else return { esbuild: { jsx: "transform" } };
122
+ config(_userConfig, { command }) {
123
+ if ("rolldownVersion" in vite) if (opts.jsxRuntime === "classic") return { oxc: {
124
+ jsx: {
125
+ runtime: "classic",
126
+ refresh: command === "serve",
127
+ development: false
128
+ },
129
+ jsxRefreshInclude: include,
130
+ jsxRefreshExclude: exclude
131
+ } };
132
+ else return {
133
+ oxc: {
134
+ jsx: {
135
+ runtime: "automatic",
136
+ importSource: jsxImportSource,
137
+ refresh: command === "serve"
138
+ },
139
+ jsxRefreshInclude: include,
140
+ jsxRefreshExclude: exclude
141
+ },
142
+ optimizeDeps: { rollupOptions: { jsx: { mode: "automatic" } } }
143
+ };
144
+ if (opts.jsxRuntime === "classic") return { esbuild: { jsx: "transform" } };
128
145
  else return {
129
146
  esbuild: {
130
147
  jsx: "automatic",
131
- jsxImportSource: opts.jsxImportSource
148
+ jsxImportSource
132
149
  },
133
- optimizeDeps: "rolldownVersion" in vite ? { rollupOptions: { jsx: { mode: "automatic" } } } : { esbuildOptions: { jsx: "automatic" } }
150
+ optimizeDeps: { esbuildOptions: { jsx: "automatic" } }
134
151
  };
135
152
  },
136
153
  configResolved(config) {
@@ -138,12 +155,7 @@ function viteReact(opts = {}) {
138
155
  projectRoot = config.root;
139
156
  isProduction = config.isProduction;
140
157
  skipFastRefresh = isProduction || config.command === "build" || config.server.hmr === false;
141
- if ("jsxPure" in opts) config.logger.warnOnce("[@vitejs/plugin-react] jsxPure was removed. You can configure esbuild.jsxSideEffects directly.");
142
- const hooks = config.plugins.map((plugin) => {
143
- var _plugin$api;
144
- return (_plugin$api = plugin.api) === null || _plugin$api === void 0 ? void 0 : _plugin$api.reactBabel;
145
- }).filter(defined);
146
- if ("rolldownVersion" in vite && !opts.babel && !hooks.length && !opts.disableOxcRecommendation) config.logger.warn("[vite:react-babel] We recommend switching to `@vitejs/plugin-react-oxc` for improved performance. More information at https://vite.dev/rolldown");
158
+ const hooks = config.plugins.map((plugin) => plugin.api?.reactBabel).filter(defined);
147
159
  if (hooks.length > 0) runPluginOverrides = (babelOptions, context) => {
148
160
  hooks.forEach((hook) => hook(babelOptions, context, config));
149
161
  };
@@ -164,17 +176,16 @@ function viteReact(opts = {}) {
164
176
  transform: {
165
177
  filter: { id: {
166
178
  include: makeIdFiltersToMatchWithQuery(include),
167
- exclude: [...exclude ? makeIdFiltersToMatchWithQuery(ensureArray(exclude)) : [], /\/node_modules\//]
179
+ exclude: makeIdFiltersToMatchWithQuery(exclude)
168
180
  } },
169
181
  async handler(code, id, options) {
170
- if (id.includes("/node_modules/")) return;
171
182
  const [filepath] = id.split("?");
172
183
  if (!filter(filepath)) return;
173
- const ssr = (options === null || options === void 0 ? void 0 : options.ssr) === true;
184
+ const ssr = options?.ssr === true;
174
185
  const babelOptions = (() => {
175
186
  if (staticBabelOptions) return staticBabelOptions;
176
187
  const newBabelOptions = createBabelOptions(typeof opts.babel === "function" ? opts.babel(id, { ssr }) : opts.babel);
177
- runPluginOverrides === null || runPluginOverrides === void 0 || runPluginOverrides(newBabelOptions, {
188
+ runPluginOverrides?.(newBabelOptions, {
178
189
  id,
179
190
  ssr
180
191
  });
@@ -183,7 +194,7 @@ function viteReact(opts = {}) {
183
194
  const plugins = [...babelOptions.plugins];
184
195
  const isJSX = filepath.endsWith("x");
185
196
  const useFastRefresh = !skipFastRefresh && !ssr && (isJSX || (opts.jsxRuntime === "classic" ? importReactRE.test(code) : code.includes(jsxImportDevRuntime) || code.includes(jsxImportRuntime)));
186
- if (useFastRefresh) plugins.push([await loadPlugin("react-refresh/babel"), { skipEnvCheck: true }]);
197
+ if (useFastRefresh && !isRolldownVite) plugins.push([await loadPlugin("react-refresh/babel"), { skipEnvCheck: true }]);
187
198
  if (opts.jsxRuntime === "classic" && isJSX) {
188
199
  if (!isProduction) plugins.push(await loadPlugin("@babel/plugin-transform-react-jsx-self"), await loadPlugin("@babel/plugin-transform-react-jsx-source"));
189
200
  }
@@ -222,13 +233,42 @@ function viteReact(opts = {}) {
222
233
  }
223
234
  }
224
235
  };
236
+ const viteRefreshWrapper = {
237
+ name: "vite:react:refresh-wrapper",
238
+ apply: "serve",
239
+ transform: isRolldownVite ? {
240
+ filter: { id: {
241
+ include: makeIdFiltersToMatchWithQuery(include),
242
+ exclude: makeIdFiltersToMatchWithQuery(exclude)
243
+ } },
244
+ handler(code, id, options) {
245
+ const ssr = options?.ssr === true;
246
+ const [filepath] = id.split("?");
247
+ const isJSX = filepath.endsWith("x");
248
+ const useFastRefresh = !skipFastRefresh && !ssr && (isJSX || code.includes(jsxImportDevRuntime) || code.includes(jsxImportRuntime));
249
+ if (!useFastRefresh) return;
250
+ const { code: newCode } = addRefreshWrapper(code, avoidSourceMapOption, "@vitejs/plugin-react", id);
251
+ return {
252
+ code: newCode,
253
+ map: null
254
+ };
255
+ }
256
+ } : void 0
257
+ };
258
+ const viteConfigPost = {
259
+ name: "vite:react:config-post",
260
+ enforce: "post",
261
+ config(userConfig) {
262
+ if (userConfig.server?.hmr === false) return { oxc: { jsx: { refresh: false } } };
263
+ }
264
+ };
225
265
  const dependencies = [
226
266
  "react",
227
267
  "react-dom",
228
268
  jsxImportDevRuntime,
229
269
  jsxImportRuntime
230
270
  ];
231
- const staticBabelPlugins = typeof opts.babel === "object" ? ((_opts$babel = opts.babel) === null || _opts$babel === void 0 ? void 0 : _opts$babel.plugins) ?? [] : [];
271
+ const staticBabelPlugins = typeof opts.babel === "object" ? opts.babel?.plugins ?? [] : [];
232
272
  const reactCompilerPlugin = getReactCompilerPlugin(staticBabelPlugins);
233
273
  if (reactCompilerPlugin != null) {
234
274
  const reactCompilerRuntimeModule = getReactCompilerRuntimeModule(reactCompilerPlugin);
@@ -239,8 +279,7 @@ function viteReact(opts = {}) {
239
279
  enforce: "pre",
240
280
  config: (userConfig) => ({
241
281
  build: silenceUseClientWarning(userConfig),
242
- optimizeDeps: { include: dependencies },
243
- resolve: { dedupe: ["react", "react-dom"] }
282
+ optimizeDeps: { include: dependencies }
244
283
  }),
245
284
  resolveId: {
246
285
  filter: { id: exactRegex(runtimePublicPath) },
@@ -262,9 +301,18 @@ function viteReact(opts = {}) {
262
301
  }];
263
302
  }
264
303
  };
265
- return [viteBabel, viteReactRefresh];
304
+ return [
305
+ viteBabel,
306
+ viteRefreshWrapper,
307
+ viteConfigPost,
308
+ viteReactRefresh
309
+ ];
266
310
  }
267
311
  viteReact.preambleCode = preambleCode;
312
+ function viteReactForCjs(options) {
313
+ return viteReact.call(this, options);
314
+ }
315
+ Object.assign(viteReactForCjs, { default: viteReactForCjs });
268
316
  function canSkipBabel(plugins, babelOptions) {
269
317
  return !(plugins.length || babelOptions.presets.length || babelOptions.configFile || babelOptions.babelrc);
270
318
  }
@@ -281,17 +329,16 @@ function loadPlugin(path) {
281
329
  return promise;
282
330
  }
283
331
  function createBabelOptions(rawOptions) {
284
- var _babelOptions$parserO;
285
332
  const babelOptions = {
286
333
  babelrc: false,
287
334
  configFile: false,
288
335
  ...rawOptions
289
336
  };
290
- babelOptions.plugins || (babelOptions.plugins = []);
291
- babelOptions.presets || (babelOptions.presets = []);
292
- babelOptions.overrides || (babelOptions.overrides = []);
293
- babelOptions.parserOpts || (babelOptions.parserOpts = {});
294
- (_babelOptions$parserO = babelOptions.parserOpts).plugins || (_babelOptions$parserO.plugins = []);
337
+ babelOptions.plugins ||= [];
338
+ babelOptions.presets ||= [];
339
+ babelOptions.overrides ||= [];
340
+ babelOptions.parserOpts ||= {};
341
+ babelOptions.parserOpts.plugins ||= [];
295
342
  return babelOptions;
296
343
  }
297
344
  function defined(value) {
@@ -303,18 +350,10 @@ function getReactCompilerPlugin(plugins) {
303
350
  function getReactCompilerRuntimeModule(plugin) {
304
351
  let moduleName = "react/compiler-runtime";
305
352
  if (Array.isArray(plugin)) {
306
- var _plugin$, _plugin$2, _plugin$3;
307
- if (((_plugin$ = plugin[1]) === null || _plugin$ === void 0 ? void 0 : _plugin$.target) === "17" || ((_plugin$2 = plugin[1]) === null || _plugin$2 === void 0 ? void 0 : _plugin$2.target) === "18") moduleName = "react-compiler-runtime";
308
- else if (typeof ((_plugin$3 = plugin[1]) === null || _plugin$3 === void 0 ? void 0 : _plugin$3.runtimeModule) === "string") {
309
- var _plugin$4;
310
- moduleName = (_plugin$4 = plugin[1]) === null || _plugin$4 === void 0 ? void 0 : _plugin$4.runtimeModule;
311
- }
353
+ if (plugin[1]?.target === "17" || plugin[1]?.target === "18") moduleName = "react-compiler-runtime";
312
354
  }
313
355
  return moduleName;
314
356
  }
315
- function ensureArray(value) {
316
- return Array.isArray(value) ? value : [value];
317
- }
318
357
 
319
358
  //#endregion
320
- export { viteReact as default };
359
+ export { viteReact as default, viteReactForCjs as "module.exports" };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vitejs/plugin-react",
3
- "version": "4.7.0",
3
+ "version": "5.0.0",
4
4
  "license": "MIT",
5
5
  "author": "Evan You",
6
6
  "description": "The default Vite plugin for React projects",
@@ -20,15 +20,7 @@
20
20
  "dist"
21
21
  ],
22
22
  "type": "module",
23
- "main": "./dist/index.cjs",
24
- "module": "./dist/index.js",
25
- "types": "./dist/index.d.ts",
26
- "exports": {
27
- ".": {
28
- "import": "./dist/index.js",
29
- "require": "./dist/index.cjs"
30
- }
31
- },
23
+ "exports": "./dist/index.js",
32
24
  "scripts": {
33
25
  "dev": "tsdown --watch",
34
26
  "build": "tsdown",
@@ -36,7 +28,7 @@
36
28
  "test-unit": "vitest run"
37
29
  },
38
30
  "engines": {
39
- "node": "^14.18.0 || >=16.0.0"
31
+ "node": "^20.19.0 || >=22.12.0"
40
32
  },
41
33
  "repository": {
42
34
  "type": "git",
@@ -51,7 +43,7 @@
51
43
  "@babel/core": "^7.28.0",
52
44
  "@babel/plugin-transform-react-jsx-self": "^7.27.1",
53
45
  "@babel/plugin-transform-react-jsx-source": "^7.27.1",
54
- "@rolldown/pluginutils": "1.0.0-beta.27",
46
+ "@rolldown/pluginutils": "1.0.0-beta.30",
55
47
  "@types/babel__core": "^7.20.5",
56
48
  "react-refresh": "^0.17.0"
57
49
  },
@@ -61,10 +53,10 @@
61
53
  "devDependencies": {
62
54
  "@vitejs/react-common": "workspace:*",
63
55
  "babel-plugin-react-compiler": "19.1.0-rc.2",
64
- "react": "^19.1.0",
65
- "react-dom": "^19.1.0",
66
- "rolldown": "1.0.0-beta.27",
67
- "tsdown": "^0.12.9",
56
+ "react": "^19.1.1",
57
+ "react-dom": "^19.1.1",
58
+ "rolldown": "1.0.0-beta.30",
59
+ "tsdown": "^0.13.2",
68
60
  "vitest": "^3.2.4"
69
61
  }
70
62
  }
package/dist/index.cjs DELETED
@@ -1,343 +0,0 @@
1
- //#region rolldown:runtime
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
10
- key = keys[i];
11
- if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
12
- get: ((k) => from[k]).bind(null, key),
13
- enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
14
- });
15
- }
16
- return to;
17
- };
18
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
19
- value: mod,
20
- enumerable: true
21
- }) : target, mod));
22
-
23
- //#endregion
24
- const node_path = __toESM(require("node:path"));
25
- const node_url = __toESM(require("node:url"));
26
- const node_fs = __toESM(require("node:fs"));
27
- const vite = __toESM(require("vite"));
28
- const __rolldown_pluginutils = __toESM(require("@rolldown/pluginutils"));
29
-
30
- //#region ../common/refresh-utils.ts
31
- const runtimePublicPath = "/@react-refresh";
32
- const reactCompRE = /extends\s+(?:React\.)?(?:Pure)?Component/;
33
- const refreshContentRE = /\$RefreshReg\$\(/;
34
- const preambleCode = `import { injectIntoGlobalHook } from "__BASE__${runtimePublicPath.slice(1)}";
35
- injectIntoGlobalHook(window);
36
- window.$RefreshReg$ = () => {};
37
- window.$RefreshSig$ = () => (type) => type;`;
38
- const getPreambleCode = (base) => preambleCode.replace("__BASE__", base);
39
- const avoidSourceMapOption = Symbol();
40
- function addRefreshWrapper(code, map, pluginName, id, reactRefreshHost = "") {
41
- const hasRefresh = refreshContentRE.test(code);
42
- const onlyReactComp = !hasRefresh && reactCompRE.test(code);
43
- const normalizedMap = map === avoidSourceMapOption ? null : map;
44
- if (!hasRefresh && !onlyReactComp) return {
45
- code,
46
- map: normalizedMap
47
- };
48
- const avoidSourceMap = map === avoidSourceMapOption;
49
- const newMap = typeof normalizedMap === "string" ? JSON.parse(normalizedMap) : normalizedMap;
50
- let newCode = code;
51
- if (hasRefresh) {
52
- const refreshHead = removeLineBreaksIfNeeded(`let prevRefreshReg;
53
- let prevRefreshSig;
54
-
55
- if (import.meta.hot && !inWebWorker) {
56
- if (!window.$RefreshReg$) {
57
- throw new Error(
58
- "${pluginName} can't detect preamble. Something is wrong."
59
- );
60
- }
61
-
62
- prevRefreshReg = window.$RefreshReg$;
63
- prevRefreshSig = window.$RefreshSig$;
64
- window.$RefreshReg$ = RefreshRuntime.getRefreshReg(${JSON.stringify(id)});
65
- window.$RefreshSig$ = RefreshRuntime.createSignatureFunctionForTransform;
66
- }
67
-
68
- `, avoidSourceMap);
69
- newCode = `${refreshHead}${newCode}
70
-
71
- if (import.meta.hot && !inWebWorker) {
72
- window.$RefreshReg$ = prevRefreshReg;
73
- window.$RefreshSig$ = prevRefreshSig;
74
- }
75
- `;
76
- if (newMap) newMap.mappings = ";".repeat(16) + newMap.mappings;
77
- }
78
- const sharedHead = removeLineBreaksIfNeeded(`import * as RefreshRuntime from "${reactRefreshHost}${runtimePublicPath}";
79
- const inWebWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope;
80
-
81
- `, avoidSourceMap);
82
- newCode = `${sharedHead}${newCode}
83
-
84
- if (import.meta.hot && !inWebWorker) {
85
- RefreshRuntime.__hmr_import(import.meta.url).then((currentExports) => {
86
- RefreshRuntime.registerExportsForReactRefresh(${JSON.stringify(id)}, currentExports);
87
- import.meta.hot.accept((nextExports) => {
88
- if (!nextExports) return;
89
- const invalidateMessage = RefreshRuntime.validateRefreshBoundaryAndEnqueueUpdate(${JSON.stringify(id)}, currentExports, nextExports);
90
- if (invalidateMessage) import.meta.hot.invalidate(invalidateMessage);
91
- });
92
- });
93
- }
94
- `;
95
- if (newMap) newMap.mappings = ";;;" + newMap.mappings;
96
- return {
97
- code: newCode,
98
- map: newMap
99
- };
100
- }
101
- function removeLineBreaksIfNeeded(code, enabled) {
102
- return enabled ? code.replace(/\n/g, "") : code;
103
- }
104
-
105
- //#endregion
106
- //#region ../common/warning.ts
107
- const silenceUseClientWarning = (userConfig) => ({ rollupOptions: { onwarn(warning, defaultHandler) {
108
- var _userConfig$build;
109
- if (warning.code === "MODULE_LEVEL_DIRECTIVE" && (warning.message.includes("use client") || warning.message.includes("use server"))) return;
110
- if (warning.code === "SOURCEMAP_ERROR" && warning.message.includes("resolve original location") && warning.pos === 0) return;
111
- if ((_userConfig$build = userConfig.build) === null || _userConfig$build === void 0 || (_userConfig$build = _userConfig$build.rollupOptions) === null || _userConfig$build === void 0 ? void 0 : _userConfig$build.onwarn) userConfig.build.rollupOptions.onwarn(warning, defaultHandler);
112
- else defaultHandler(warning);
113
- } } });
114
-
115
- //#endregion
116
- //#region src/index.ts
117
- const _dirname = (0, node_path.dirname)((0, node_url.fileURLToPath)(require("url").pathToFileURL(__filename).href));
118
- const refreshRuntimePath = (0, node_path.join)(_dirname, "refresh-runtime.js");
119
- let babel;
120
- async function loadBabel() {
121
- if (!babel) babel = await import("@babel/core");
122
- return babel;
123
- }
124
- const defaultIncludeRE = /\.[tj]sx?$/;
125
- const tsRE = /\.tsx?$/;
126
- function viteReact(opts = {}) {
127
- var _opts$babel;
128
- const include = opts.include ?? defaultIncludeRE;
129
- const exclude = opts.exclude;
130
- const filter = (0, vite.createFilter)(include, exclude);
131
- const jsxImportSource = opts.jsxImportSource ?? "react";
132
- const jsxImportRuntime = `${jsxImportSource}/jsx-runtime`;
133
- const jsxImportDevRuntime = `${jsxImportSource}/jsx-dev-runtime`;
134
- let runningInVite = false;
135
- let isProduction = true;
136
- let projectRoot = process.cwd();
137
- let skipFastRefresh = true;
138
- let runPluginOverrides;
139
- let staticBabelOptions;
140
- const importReactRE = /\bimport\s+(?:\*\s+as\s+)?React\b/;
141
- const viteBabel = {
142
- name: "vite:react-babel",
143
- enforce: "pre",
144
- config() {
145
- if (opts.jsxRuntime === "classic") if ("rolldownVersion" in vite) return { oxc: { jsx: {
146
- runtime: "classic",
147
- development: false
148
- } } };
149
- else return { esbuild: { jsx: "transform" } };
150
- else return {
151
- esbuild: {
152
- jsx: "automatic",
153
- jsxImportSource: opts.jsxImportSource
154
- },
155
- optimizeDeps: "rolldownVersion" in vite ? { rollupOptions: { jsx: { mode: "automatic" } } } : { esbuildOptions: { jsx: "automatic" } }
156
- };
157
- },
158
- configResolved(config) {
159
- runningInVite = true;
160
- projectRoot = config.root;
161
- isProduction = config.isProduction;
162
- skipFastRefresh = isProduction || config.command === "build" || config.server.hmr === false;
163
- if ("jsxPure" in opts) config.logger.warnOnce("[@vitejs/plugin-react] jsxPure was removed. You can configure esbuild.jsxSideEffects directly.");
164
- const hooks = config.plugins.map((plugin) => {
165
- var _plugin$api;
166
- return (_plugin$api = plugin.api) === null || _plugin$api === void 0 ? void 0 : _plugin$api.reactBabel;
167
- }).filter(defined);
168
- if ("rolldownVersion" in vite && !opts.babel && !hooks.length && !opts.disableOxcRecommendation) config.logger.warn("[vite:react-babel] We recommend switching to `@vitejs/plugin-react-oxc` for improved performance. More information at https://vite.dev/rolldown");
169
- if (hooks.length > 0) runPluginOverrides = (babelOptions, context) => {
170
- hooks.forEach((hook) => hook(babelOptions, context, config));
171
- };
172
- else if (typeof opts.babel !== "function") {
173
- staticBabelOptions = createBabelOptions(opts.babel);
174
- if (canSkipBabel(staticBabelOptions.plugins, staticBabelOptions) && skipFastRefresh && (opts.jsxRuntime === "classic" ? isProduction : true)) delete viteBabel.transform;
175
- }
176
- },
177
- options(options) {
178
- if (!runningInVite) {
179
- options.jsx = {
180
- mode: opts.jsxRuntime,
181
- importSource: opts.jsxImportSource
182
- };
183
- return options;
184
- }
185
- },
186
- transform: {
187
- filter: { id: {
188
- include: (0, __rolldown_pluginutils.makeIdFiltersToMatchWithQuery)(include),
189
- exclude: [...exclude ? (0, __rolldown_pluginutils.makeIdFiltersToMatchWithQuery)(ensureArray(exclude)) : [], /\/node_modules\//]
190
- } },
191
- async handler(code, id, options) {
192
- if (id.includes("/node_modules/")) return;
193
- const [filepath] = id.split("?");
194
- if (!filter(filepath)) return;
195
- const ssr = (options === null || options === void 0 ? void 0 : options.ssr) === true;
196
- const babelOptions = (() => {
197
- if (staticBabelOptions) return staticBabelOptions;
198
- const newBabelOptions = createBabelOptions(typeof opts.babel === "function" ? opts.babel(id, { ssr }) : opts.babel);
199
- runPluginOverrides === null || runPluginOverrides === void 0 || runPluginOverrides(newBabelOptions, {
200
- id,
201
- ssr
202
- });
203
- return newBabelOptions;
204
- })();
205
- const plugins = [...babelOptions.plugins];
206
- const isJSX = filepath.endsWith("x");
207
- const useFastRefresh = !skipFastRefresh && !ssr && (isJSX || (opts.jsxRuntime === "classic" ? importReactRE.test(code) : code.includes(jsxImportDevRuntime) || code.includes(jsxImportRuntime)));
208
- if (useFastRefresh) plugins.push([await loadPlugin("react-refresh/babel"), { skipEnvCheck: true }]);
209
- if (opts.jsxRuntime === "classic" && isJSX) {
210
- if (!isProduction) plugins.push(await loadPlugin("@babel/plugin-transform-react-jsx-self"), await loadPlugin("@babel/plugin-transform-react-jsx-source"));
211
- }
212
- if (canSkipBabel(plugins, babelOptions)) return;
213
- const parserPlugins = [...babelOptions.parserOpts.plugins];
214
- if (!filepath.endsWith(".ts")) parserPlugins.push("jsx");
215
- if (tsRE.test(filepath)) parserPlugins.push("typescript");
216
- const babel$1 = await loadBabel();
217
- const result = await babel$1.transformAsync(code, {
218
- ...babelOptions,
219
- root: projectRoot,
220
- filename: id,
221
- sourceFileName: filepath,
222
- retainLines: getReactCompilerPlugin(plugins) != null ? false : !isProduction && isJSX && opts.jsxRuntime !== "classic",
223
- parserOpts: {
224
- ...babelOptions.parserOpts,
225
- sourceType: "module",
226
- allowAwaitOutsideFunction: true,
227
- plugins: parserPlugins
228
- },
229
- generatorOpts: {
230
- ...babelOptions.generatorOpts,
231
- importAttributesKeyword: "with",
232
- decoratorsBeforeExport: true
233
- },
234
- plugins,
235
- sourceMaps: true
236
- });
237
- if (result) {
238
- if (!useFastRefresh) return {
239
- code: result.code,
240
- map: result.map
241
- };
242
- return addRefreshWrapper(result.code, result.map, "@vitejs/plugin-react", id, opts.reactRefreshHost);
243
- }
244
- }
245
- }
246
- };
247
- const dependencies = [
248
- "react",
249
- "react-dom",
250
- jsxImportDevRuntime,
251
- jsxImportRuntime
252
- ];
253
- const staticBabelPlugins = typeof opts.babel === "object" ? ((_opts$babel = opts.babel) === null || _opts$babel === void 0 ? void 0 : _opts$babel.plugins) ?? [] : [];
254
- const reactCompilerPlugin = getReactCompilerPlugin(staticBabelPlugins);
255
- if (reactCompilerPlugin != null) {
256
- const reactCompilerRuntimeModule = getReactCompilerRuntimeModule(reactCompilerPlugin);
257
- dependencies.push(reactCompilerRuntimeModule);
258
- }
259
- const viteReactRefresh = {
260
- name: "vite:react-refresh",
261
- enforce: "pre",
262
- config: (userConfig) => ({
263
- build: silenceUseClientWarning(userConfig),
264
- optimizeDeps: { include: dependencies },
265
- resolve: { dedupe: ["react", "react-dom"] }
266
- }),
267
- resolveId: {
268
- filter: { id: (0, __rolldown_pluginutils.exactRegex)(runtimePublicPath) },
269
- handler(id) {
270
- if (id === runtimePublicPath) return id;
271
- }
272
- },
273
- load: {
274
- filter: { id: (0, __rolldown_pluginutils.exactRegex)(runtimePublicPath) },
275
- handler(id) {
276
- if (id === runtimePublicPath) return (0, node_fs.readFileSync)(refreshRuntimePath, "utf-8").replace(/__README_URL__/g, "https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react");
277
- }
278
- },
279
- transformIndexHtml(_, config) {
280
- if (!skipFastRefresh) return [{
281
- tag: "script",
282
- attrs: { type: "module" },
283
- children: getPreambleCode(config.server.config.base)
284
- }];
285
- }
286
- };
287
- return [viteBabel, viteReactRefresh];
288
- }
289
- viteReact.preambleCode = preambleCode;
290
- function canSkipBabel(plugins, babelOptions) {
291
- return !(plugins.length || babelOptions.presets.length || babelOptions.configFile || babelOptions.babelrc);
292
- }
293
- const loadedPlugin = /* @__PURE__ */ new Map();
294
- function loadPlugin(path) {
295
- const cached = loadedPlugin.get(path);
296
- if (cached) return cached;
297
- const promise = import(path).then((module$1) => {
298
- const value = module$1.default || module$1;
299
- loadedPlugin.set(path, value);
300
- return value;
301
- });
302
- loadedPlugin.set(path, promise);
303
- return promise;
304
- }
305
- function createBabelOptions(rawOptions) {
306
- var _babelOptions$parserO;
307
- const babelOptions = {
308
- babelrc: false,
309
- configFile: false,
310
- ...rawOptions
311
- };
312
- babelOptions.plugins || (babelOptions.plugins = []);
313
- babelOptions.presets || (babelOptions.presets = []);
314
- babelOptions.overrides || (babelOptions.overrides = []);
315
- babelOptions.parserOpts || (babelOptions.parserOpts = {});
316
- (_babelOptions$parserO = babelOptions.parserOpts).plugins || (_babelOptions$parserO.plugins = []);
317
- return babelOptions;
318
- }
319
- function defined(value) {
320
- return value !== void 0;
321
- }
322
- function getReactCompilerPlugin(plugins) {
323
- return plugins.find((p) => p === "babel-plugin-react-compiler" || Array.isArray(p) && p[0] === "babel-plugin-react-compiler");
324
- }
325
- function getReactCompilerRuntimeModule(plugin) {
326
- let moduleName = "react/compiler-runtime";
327
- if (Array.isArray(plugin)) {
328
- var _plugin$, _plugin$2, _plugin$3;
329
- if (((_plugin$ = plugin[1]) === null || _plugin$ === void 0 ? void 0 : _plugin$.target) === "17" || ((_plugin$2 = plugin[1]) === null || _plugin$2 === void 0 ? void 0 : _plugin$2.target) === "18") moduleName = "react-compiler-runtime";
330
- else if (typeof ((_plugin$3 = plugin[1]) === null || _plugin$3 === void 0 ? void 0 : _plugin$3.runtimeModule) === "string") {
331
- var _plugin$4;
332
- moduleName = (_plugin$4 = plugin[1]) === null || _plugin$4 === void 0 ? void 0 : _plugin$4.runtimeModule;
333
- }
334
- }
335
- return moduleName;
336
- }
337
- function ensureArray(value) {
338
- return Array.isArray(value) ? value : [value];
339
- }
340
-
341
- //#endregion
342
- module.exports = viteReact;
343
- module.exports.default = module.exports
package/dist/index.d.cts DELETED
@@ -1,67 +0,0 @@
1
- import { ParserOptions, TransformOptions } from "@babel/core";
2
- import { Plugin, ResolvedConfig } from "vite";
3
-
4
- //#region src/index.d.ts
5
- interface Options {
6
- include?: string | RegExp | Array<string | RegExp>;
7
- exclude?: string | RegExp | Array<string | RegExp>;
8
- /**
9
- * Control where the JSX factory is imported from.
10
- * https://esbuild.github.io/api/#jsx-import-source
11
- * @default 'react'
12
- */
13
- jsxImportSource?: string;
14
- /**
15
- * Note: Skipping React import with classic runtime is not supported from v4
16
- * @default "automatic"
17
- */
18
- jsxRuntime?: 'classic' | 'automatic';
19
- /**
20
- * Babel configuration applied in both dev and prod.
21
- */
22
- babel?: BabelOptions | ((id: string, options: {
23
- ssr?: boolean;
24
- }) => BabelOptions);
25
- /**
26
- * React Fast Refresh runtime URL prefix.
27
- * Useful in a module federation context to enable HMR by specifying
28
- * the host application URL in the Vite config of a remote application.
29
- * @example
30
- * reactRefreshHost: 'http://localhost:3000'
31
- */
32
- reactRefreshHost?: string;
33
- /**
34
- * If set, disables the recommendation to use `@vitejs/plugin-react-oxc`
35
- */
36
- disableOxcRecommendation?: boolean;
37
- }
38
- type BabelOptions = Omit<TransformOptions, 'ast' | 'filename' | 'root' | 'sourceFileName' | 'sourceMaps' | 'inputSourceMap'>;
39
- /**
40
- * The object type used by the `options` passed to plugins with
41
- * an `api.reactBabel` method.
42
- */
43
- interface ReactBabelOptions extends BabelOptions {
44
- plugins: Extract<BabelOptions['plugins'], any[]>;
45
- presets: Extract<BabelOptions['presets'], any[]>;
46
- overrides: Extract<BabelOptions['overrides'], any[]>;
47
- parserOpts: ParserOptions & {
48
- plugins: Extract<ParserOptions['plugins'], any[]>;
49
- };
50
- }
51
- type ReactBabelHook = (babelConfig: ReactBabelOptions, context: ReactBabelHookContext, config: ResolvedConfig) => void;
52
- type ReactBabelHookContext = {
53
- ssr: boolean;
54
- id: string;
55
- };
56
- type ViteReactPluginApi = {
57
- /**
58
- * Manipulate the Babel options of `@vitejs/plugin-react`
59
- */
60
- reactBabel?: ReactBabelHook;
61
- };
62
- declare function viteReact(opts?: Options): Plugin[];
63
- declare namespace viteReact {
64
- var preambleCode: string;
65
- }
66
- //#endregion
67
- export { BabelOptions, Options, ReactBabelOptions, ViteReactPluginApi, viteReact as default };