@vitejs/plugin-react-swc 4.0.0 → 4.1.0

package/index.js

@@ -15,22 +15,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(
@@ -38,29 +31,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) => {
@@ -71,14 +41,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
@@ -96,6 +62,7 @@ const _dirname = typeof __dirname !== "undefined" ? __dirname : dirname(fileURLT
 const resolve = createRequire(typeof __filename !== "undefined" ? __filename : import.meta.url).resolve;
 const react = (_options) => {
 	let hmrDisabled = false;
+	let viteCacheRoot;
 	const options = {
 		jsxImportSource: _options?.jsxImportSource ?? "react",
 		tsDecorators: _options?.tsDecorators,
@@ -128,10 +95,11 @@ const react = (_options) => {
 				oxc: false,
 				optimizeDeps: {
 					include: [`${options.jsxImportSource}/jsx-dev-runtime`],
-					..."rolldownVersion" in vite ? { rollupOptions: { jsx: { mode: "automatic" } } } : { esbuildOptions: { jsx: "automatic" } }
+					..."rolldownVersion" in vite ? { rollupOptions: { transform: { jsx: { runtime: "automatic" } } } } : { esbuildOptions: { jsx: "automatic" } }
 				}
 			}),
 			configResolved(config) {
+				viteCacheRoot = config.cacheDir;
 				if (config.server.hmr === false) hmrDisabled = true;
 				const mdxIndex = config.plugins.findIndex((p) => p.name === "@mdx-js/rollup");
 				if (mdxIndex !== -1 && mdxIndex > config.plugins.findIndex((p) => p.name === "vite:react-swc")) throw new Error("[vite:react-swc] The MDX plugin should be placed before this plugin");
@@ -147,7 +115,7 @@ const react = (_options) => {
 			async transform(code, _id, transformOptions) {
 				const id = _id.split("?")[0];
 				const refresh = !transformOptions?.ssr && !hmrDisabled;
-				const result = await transformWithOptions(id, code, options.devTarget, options, {
+				const result = await transformWithOptions(id, code, options.devTarget, options, viteCacheRoot, {
 					refresh,
 					development: true,
 					runtime: "automatic",
@@ -155,7 +123,10 @@ const react = (_options) => {
 				});
 				if (!result) return;
 				if (!refresh) return result;
-				return addRefreshWrapper(result.code, result.map, "@vitejs/plugin-react-swc", id, options.reactRefreshHost);
+				return {
+					code: addRefreshWrapper(result.code, "@vitejs/plugin-react-swc", id, options.reactRefreshHost) ?? result.code,
+					map: result.map
+				};
 			}
 		},
 		options.plugins ? {
@@ -163,7 +134,10 @@ const react = (_options) => {
 			apply: "build",
 			enforce: "pre",
 			config: (userConfig) => ({ build: silenceUseClientWarning(userConfig) }),
-			transform: (code, _id) => transformWithOptions(_id.split("?")[0], code, "esnext", options, {
+			configResolved(config) {
+				viteCacheRoot = config.cacheDir;
+			},
+			transform: (code, _id) => transformWithOptions(_id.split("?")[0], code, "esnext", options, viteCacheRoot, {
 				runtime: "automatic",
 				importSource: options.jsxImportSource
 			})
@@ -177,11 +151,14 @@ const react = (_options) => {
 					jsxImportSource: options.jsxImportSource,
 					tsconfigRaw: { compilerOptions: { useDefineForClassFields: true } }
 				}
-			})
+			}),
+			configResolved(config) {
+				viteCacheRoot = config.cacheDir;
+			}
 		}
 	];
 };
-const transformWithOptions = async (id, code, target, options, reactConfig) => {
+const transformWithOptions = async (id, code, target, options, viteCacheRoot, reactConfig) => {
 	const decorators = options?.tsDecorators ?? false;
 	const parser = options.parserConfig ? options.parserConfig(id) : id.endsWith(".tsx") ? {
 		syntax: "typescript",
@@ -209,7 +186,10 @@ const transformWithOptions = async (id, code, target, options, reactConfig) => {
 			jsc: {
 				target,
 				parser,
-				experimental: { plugins: options.plugins },
+				experimental: {
+					plugins: options.plugins,
+					cacheRoot: join(viteCacheRoot ?? "node_modules/.vite", ".swc")
+				},
 				transform: {
 					useDefineForClassFields: true,
 					react: reactConfig

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitejs/plugin-react-swc",
-  "version": "4.0.0",
+  "version": "4.1.0",
   "license": "MIT",
   "author": "Arnaud Barré (https://github.com/ArnaudBarre)",
   "description": "Speed up your Vite dev server with SWC",
@@ -26,8 +26,8 @@
   },
   "homepage": "https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react-swc#readme",
   "dependencies": {
-    "@rolldown/pluginutils": "1.0.0-beta.30",
-    "@swc/core": "^1.13.2"
+    "@rolldown/pluginutils": "1.0.0-beta.35",
+    "@swc/core": "^1.13.5"
   },
   "peerDependencies": {
     "vite": "^4 || ^5 || ^6 || ^7"

package/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