@vitejs/plugin-react 5.0.2 → 5.0.4

package/README.md

@@ -127,10 +127,6 @@ Otherwise, you'll probably get this error:
 Uncaught Error: @vitejs/plugin-react can't detect preamble. Something is wrong.
 ```
 
-### disableOxcRecommendation
-
-If set, disables the recommendation to use `@vitejs/plugin-react-oxc` (which is shown when `rolldown-vite` is detected and `babel` is not configured).
-
 ## Consistent components exports
 
 For React refresh to work correctly, your file should only export React components. You can find a good explanation in the [Gatsby docs](https://www.gatsbyjs.com/docs/reference/local-development/fast-refresh/#how-it-works).

package/dist/index.js

@@ -14,22 +14,15 @@ injectIntoGlobalHook(window);
 window.$RefreshReg$ = () => {};
 window.$RefreshSig$ = () => (type) => type;`;
 const getPreambleCode = (base) => preambleCode.replace("__BASE__", base);
-const avoidSourceMapOption = Symbol();
-function addRefreshWrapper(code, map, pluginName, id, reactRefreshHost = "") {
+function addRefreshWrapper(code, pluginName, id, reactRefreshHost = "") {
 	const hasRefresh = refreshContentRE.test(code);
 	const onlyReactComp = !hasRefresh && reactCompRE.test(code);
-	const normalizedMap = map === avoidSourceMapOption ? null : map;
-	if (!hasRefresh && !onlyReactComp) return {
-		code,
-		map: normalizedMap
-	};
-	const avoidSourceMap = map === avoidSourceMapOption;
-	const newMap = typeof normalizedMap === "string" ? JSON.parse(normalizedMap) : normalizedMap;
+	if (!hasRefresh && !onlyReactComp) return void 0;
 	let newCode = code;
-	if (hasRefresh) {
-		const refreshHead = removeLineBreaksIfNeeded(`let prevRefreshReg;
-let prevRefreshSig;
+	newCode += `
 
+import * as RefreshRuntime from "${reactRefreshHost}${runtimePublicPath}";
+const inWebWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope;
 if (import.meta.hot && !inWebWorker) {
   if (!window.$RefreshReg$) {
     throw new Error(
@@ -37,29 +30,6 @@ if (import.meta.hot && !inWebWorker) {
     );
   }
 
-  prevRefreshReg = window.$RefreshReg$;
-  prevRefreshSig = window.$RefreshSig$;
-  window.$RefreshReg$ = RefreshRuntime.getRefreshReg(${JSON.stringify(id)});
-  window.$RefreshSig$ = RefreshRuntime.createSignatureFunctionForTransform;
-}
-
-`, avoidSourceMap);
-		newCode = `${refreshHead}${newCode}
-
-if (import.meta.hot && !inWebWorker) {
-  window.$RefreshReg$ = prevRefreshReg;
-  window.$RefreshSig$ = prevRefreshSig;
-}
-`;
-		if (newMap) newMap.mappings = ";".repeat(16) + newMap.mappings;
-	}
-	const sharedHead = removeLineBreaksIfNeeded(`import * as RefreshRuntime from "${reactRefreshHost}${runtimePublicPath}";
-const inWebWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope;
-
-`, avoidSourceMap);
-	newCode = `${sharedHead}${newCode}
-
-if (import.meta.hot && !inWebWorker) {
   RefreshRuntime.__hmr_import(import.meta.url).then((currentExports) => {
     RefreshRuntime.registerExportsForReactRefresh(${JSON.stringify(id)}, currentExports);
     import.meta.hot.accept((nextExports) => {
@@ -70,14 +40,10 @@ if (import.meta.hot && !inWebWorker) {
   });
 }
 `;
-	if (newMap) newMap.mappings = ";;;" + newMap.mappings;
-	return {
-		code: newCode,
-		map: newMap
-	};
-}
-function removeLineBreaksIfNeeded(code, enabled) {
-	return enabled ? code.replace(/\n/g, "") : code;
+	if (hasRefresh) newCode += `function $RefreshReg$(type, id) { return RefreshRuntime.register(type, ${JSON.stringify(id)} + ' ' + id) }
+function $RefreshSig$() { return RefreshRuntime.createSignatureFunctionForTransform(); }
+`;
+	return newCode;
 }
 
 //#endregion
@@ -114,6 +80,8 @@ function viteReact(opts = {}) {
 	let isProduction = true;
 	let projectRoot = process.cwd();
 	let skipFastRefresh = true;
+	let base;
+	let isFullBundle = false;
 	let runPluginOverrides;
 	let staticBabelOptions;
 	const importReactRE = /\bimport\s+(?:\*\s+as\s+)?React\b/;
@@ -127,8 +95,8 @@ function viteReact(opts = {}) {
 					refresh: command === "serve",
 					development: false
 				},
-				jsxRefreshInclude: include,
-				jsxRefreshExclude: exclude
+				jsxRefreshInclude: makeIdFiltersToMatchWithQuery(include),
+				jsxRefreshExclude: makeIdFiltersToMatchWithQuery(exclude)
 			} };
 			else return {
 				oxc: {
@@ -137,8 +105,8 @@ function viteReact(opts = {}) {
 						importSource: opts.jsxImportSource,
 						refresh: command === "serve"
 					},
-					jsxRefreshInclude: include,
-					jsxRefreshExclude: exclude
+					jsxRefreshInclude: makeIdFiltersToMatchWithQuery(include),
+					jsxRefreshExclude: makeIdFiltersToMatchWithQuery(exclude)
 				},
 				optimizeDeps: { rollupOptions: { transform: { jsx: { runtime: "automatic" } } } }
 			};
@@ -153,6 +121,8 @@ function viteReact(opts = {}) {
 		},
 		configResolved(config) {
 			runningInVite = true;
+			base = config.base;
+			if (config.experimental.fullBundleMode) isFullBundle = true;
 			projectRoot = config.root;
 			isProduction = config.isProduction;
 			skipFastRefresh = isProduction || config.command === "build" || config.server.hmr === false;
@@ -212,8 +182,7 @@ function viteReact(opts = {}) {
 				const parserPlugins = [...babelOptions.parserOpts.plugins];
 				if (!filepath.endsWith(".ts")) parserPlugins.push("jsx");
 				if (tsRE.test(filepath)) parserPlugins.push("typescript");
-				const babel$1 = await loadBabel();
-				const result = await babel$1.transformAsync(code, {
+				const result = await (await loadBabel()).transformAsync(code, {
 					...babelOptions,
 					root: projectRoot,
 					filename: id,
@@ -238,7 +207,10 @@ function viteReact(opts = {}) {
 						code: result.code,
 						map: result.map
 					};
-					return addRefreshWrapper(result.code, result.map, "@vitejs/plugin-react", id, opts.reactRefreshHost);
+					return {
+						code: addRefreshWrapper(result.code, "@vitejs/plugin-react", id, opts.reactRefreshHost) ?? result.code,
+						map: result.map
+					};
 				}
 			}
 		}
@@ -246,6 +218,26 @@ function viteReact(opts = {}) {
 	const viteRefreshWrapper = {
 		name: "vite:react:refresh-wrapper",
 		apply: "serve",
+		async applyToEnvironment(env) {
+			if (env.config.consumer !== "client" || skipFastRefresh) return false;
+			let nativePlugin;
+			try {
+				nativePlugin = (await import("vite/internal")).reactRefreshWrapperPlugin;
+			} catch {}
+			if (!nativePlugin || [
+				"7.1.10",
+				"7.1.11",
+				"7.1.12"
+			].includes(vite.version)) return true;
+			delete viteRefreshWrapper.transform;
+			return nativePlugin({
+				cwd: process.cwd(),
+				include: makeIdFiltersToMatchWithQuery(include),
+				exclude: makeIdFiltersToMatchWithQuery(exclude),
+				jsxImportSource,
+				reactRefreshHost: opts.reactRefreshHost ?? ""
+			});
+		},
 		transform: {
 			filter: { id: {
 				include: makeIdFiltersToMatchWithQuery(include),
@@ -255,13 +247,12 @@ function viteReact(opts = {}) {
 				const ssr = options?.ssr === true;
 				const [filepath] = id.split("?");
 				const isJSX = filepath.endsWith("x");
-				const useFastRefresh = !skipFastRefresh && !ssr && (isJSX || code.includes(jsxImportDevRuntime) || code.includes(jsxImportRuntime));
-				if (!useFastRefresh) return;
-				const { code: newCode } = addRefreshWrapper(code, avoidSourceMapOption, "@vitejs/plugin-react", id, opts.reactRefreshHost);
-				return {
+				if (!(!skipFastRefresh && !ssr && (isJSX || code.includes(jsxImportDevRuntime) || code.includes(jsxImportRuntime)))) return;
+				const newCode = addRefreshWrapper(code, "@vitejs/plugin-react", id, opts.reactRefreshHost);
+				return newCode ? {
 					code: newCode,
 					map: null
-				};
+				} : void 0;
 			}
 		}
 	};
@@ -272,6 +263,20 @@ function viteReact(opts = {}) {
 			if (userConfig.server?.hmr === false) return { oxc: { jsx: { refresh: false } } };
 		}
 	};
+	const viteReactRefreshFullBundleMode = {
+		name: "vite:react-refresh-fbm",
+		enforce: "pre",
+		transformIndexHtml: {
+			handler() {
+				if (!skipFastRefresh && isFullBundle) return [{
+					tag: "script",
+					attrs: { type: "module" },
+					children: getPreambleCode(base)
+				}];
+			},
+			order: "pre"
+		}
+	};
 	const dependencies = [
 		"react",
 		"react-dom",
@@ -303,17 +308,21 @@ function viteReact(opts = {}) {
 				if (id === runtimePublicPath) return readFileSync(refreshRuntimePath, "utf-8").replace(/__README_URL__/g, "https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react");
 			}
 		},
-		transformIndexHtml(_, config) {
-			if (!skipFastRefresh) return [{
+		transformIndexHtml() {
+			if (!skipFastRefresh && !isFullBundle) return [{
 				tag: "script",
 				attrs: { type: "module" },
-				children: getPreambleCode(config.server.config.base)
+				children: getPreambleCode(base)
 			}];
 		}
 	};
 	return [
 		viteBabel,
-		...isRolldownVite ? [viteRefreshWrapper, viteConfigPost] : [],
+		...isRolldownVite ? [
+			viteRefreshWrapper,
+			viteConfigPost,
+			viteReactRefreshFullBundleMode
+		] : [],
 		viteReactRefresh
 	];
 }

package/dist/refresh-runtime.js

@@ -243,7 +243,7 @@ function performReactRefresh() {
   }
 }
 
-function register(type, id) {
+export function register(type, id) {
   if (type === null) {
     return
   }
@@ -564,10 +564,6 @@ function isPlainObject(obj) {
  * Plugin utils
  */
 
-export function getRefreshReg(filename) {
-  return (type, id) => register(type, filename + ' ' + id)
-}
-
 // Taken from https://github.com/pmmmwh/react-refresh-webpack-plugin/blob/main/lib/runtime/RefreshUtils.js#L141
 // This allows to resister components not detected by SWC like styled component
 export function registerExportsForReactRefresh(filename, moduleExports) {
@@ -653,10 +649,7 @@ export function validateRefreshBoundaryAndEnqueueUpdate(
 
 function predicateOnExport(ignoredExports, moduleExports, predicate) {
   for (const key in moduleExports) {
-    if (key === '__esModule') continue
     if (ignoredExports.includes(key)) continue
-    const desc = Object.getOwnPropertyDescriptor(moduleExports, key)
-    if (desc && desc.get) return key
     if (!predicate(key, moduleExports[key])) return key
   }
   return true

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitejs/plugin-react",
-  "version": "5.0.2",
+  "version": "5.0.4",
   "license": "MIT",
   "author": "Evan You",
   "description": "The default Vite plugin for React projects",
@@ -40,10 +40,10 @@
   },
   "homepage": "https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react#readme",
   "dependencies": {
-    "@babel/core": "^7.28.3",
+    "@babel/core": "^7.28.4",
     "@babel/plugin-transform-react-jsx-self": "^7.27.1",
     "@babel/plugin-transform-react-jsx-source": "^7.27.1",
-    "@rolldown/pluginutils": "1.0.0-beta.34",
+    "@rolldown/pluginutils": "1.0.0-beta.38",
     "@types/babel__core": "^7.20.5",
     "react-refresh": "^0.17.0"
   },
@@ -52,11 +52,11 @@
   },
   "devDependencies": {
     "@vitejs/react-common": "workspace:*",
-    "babel-plugin-react-compiler": "19.1.0-rc.2",
+    "babel-plugin-react-compiler": "19.1.0-rc.3",
     "react": "^19.1.1",
     "react-dom": "^19.1.1",
-    "rolldown": "1.0.0-beta.34",
-    "tsdown": "^0.14.2",
+    "rolldown": "1.0.0-beta.38",
+    "tsdown": "^0.15.4",
     "vitest": "^3.2.4"
   }
 }