vite-plugin-rnw 0.0.7 → 0.0.8-1

package/README.md

@@ -2,12 +2,7 @@
 
 A vite plugin for React Native Web projects.
 
-This plugin is based on the [react plugin](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md)
-
-- enable [Fast Refresh](https://www.npmjs.com/package/react-refresh) in development (requires react >= 16.9)
-- use the [automatic JSX runtime](https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html)
-- use custom Babel plugins/presets
-- small installation size
+This plugin uses the [react plugin](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) internally and applies a lot of fixes for react native web on top.
 
 ```js
 // vite.config.js
@@ -69,31 +64,3 @@ rnw({
   }
 })
 ```
-
-#### Proposed syntax
-
-If you are using ES syntax that are still in proposal status (e.g. class properties), you can selectively enable them with the `babel.parserOpts.plugins` option:
-
-```js
-rnw({
-  babel: {
-    parserOpts: {
-      plugins: ["decorators-legacy"],
-    },
-  },
-});
-```
-
-This option does not enable _code transformation_. That is handled by esbuild.
-
-**Note:** TypeScript syntax is handled automatically.
-
-Here's the [complete list of Babel parser plugins](https://babeljs.io/docs/en/babel-parser#ecmascript-proposalshttpsgithubcombabelproposals).
-
-## 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).
-
-If an incompatible change in exports is found, the module will be invalidated and HMR will propagate. To make it easier to export simple constants alongside your component, the module is only invalidated when their value changes.
-
-You can catch mistakes and get more detailed warning with this [eslint rule](https://github.com/ArnaudBarre/eslint-plugin-react-refresh).

package/dist/index.d.ts

@@ -1,68 +1,8 @@
-import { BuildOptions, Plugin, ResolvedConfig, UserConfig } from "vite";
-import { ParserOptions, TransformOptions } from "@babel/core";
+import { Plugin } from "vite";
+import { Options } from "@vitejs/plugin-react";
 
 //#region src/index.d.ts
-declare const silenceUseClientWarning: (userConfig: UserConfig) => BuildOptions;
-interface Options {
-  include?: string | RegExp | Array<string | RegExp>;
-  exclude?: string | RegExp | Array<string | RegExp>;
-  /**
-   * Control where the JSX factory is imported from.
-   * https://esbuild.github.io/api/#jsx-import-source
-   * @default 'react'
-   */
-  jsxImportSource?: string;
-  /**
-   * Note: Skipping React import with classic runtime is not supported from v4
-   * @default "automatic"
-   */
-  jsxRuntime?: "classic" | "automatic";
-  /**
-   * Babel configuration applied in both dev and prod.
-   */
-  babel?: BabelOptions | ((id: string, options: {
-    ssr?: boolean;
-  }) => BabelOptions);
-  /**
-   * React Fast Refresh runtime URL prefix.
-   * Useful in a module federation context to enable HMR by specifying
-   * the host application URL in the Vite config of a remote application.
-   * @example
-   * reactRefreshHost: 'http://localhost:3000'
-   */
-  reactRefreshHost?: string;
-  /**
-   * If set, disables the recommendation to use `@vitejs/plugin-react-oxc`
-   */
-  disableOxcRecommendation?: boolean;
-}
-type BabelOptions = Omit<TransformOptions, "ast" | "filename" | "root" | "sourceFileName" | "sourceMaps" | "inputSourceMap">;
-/**
- * The object type used by the `options` passed to plugins with
- * an `api.reactBabel` method.
- */
-interface ReactBabelOptions extends BabelOptions {
-  plugins: Extract<BabelOptions["plugins"], any[]>;
-  presets: Extract<BabelOptions["presets"], any[]>;
-  overrides: Extract<BabelOptions["overrides"], any[]>;
-  parserOpts: ParserOptions & {
-    plugins: Extract<ParserOptions["plugins"], any[]>;
-  };
-}
-type ReactBabelHook = (babelConfig: ReactBabelOptions, context: ReactBabelHookContext, config: ResolvedConfig) => void;
-type ReactBabelHookContext = {
-  ssr: boolean;
-  id: string;
-};
-type ViteReactPluginApi = {
-  /**
-   * Manipulate the Babel options of `@vitejs/plugin-react`
-   */
-  reactBabel?: ReactBabelHook;
-};
-declare function rnw(opts?: Options): Plugin[];
-declare namespace rnw {
-  var preambleCode: string;
-}
+type RnwOptions = Options;
+declare function rnw(opts?: RnwOptions): Plugin[];
 //#endregion
-export { BabelOptions, Options, ReactBabelOptions, ViteReactPluginApi, rnw, silenceUseClientWarning };
+export { RnwOptions, rnw };

package/dist/index.js

@@ -1,101 +1,20 @@
-import { dirname, join } from "node:path";
-import { fileURLToPath } from "node:url";
-import { readFileSync } from "node:fs";
 import * as vite from "vite";
 import { createFilter } from "vite";
 import { esbuildFlowPlugin, flowPlugin } from "@bunchtogether/vite-plugin-flow";
 import commonjs from "vite-plugin-commonjs";
-import { exactRegex, makeIdFiltersToMatchWithQuery } from "@rolldown/pluginutils";
+import { makeIdFiltersToMatchWithQuery } from "@rolldown/pluginutils";
+import MagicString from "magic-string";
+import react from "@vitejs/plugin-react";
 
-//#region src/refresh-utils.ts
-const runtimePublicPath = "/@react-refresh";
-const reactCompRE = /extends\s+(?:React\.)?(?:Pure)?Component/;
-const refreshContentRE = /\$RefreshReg\$\(/;
-const preambleCode = `import { injectIntoGlobalHook } from "__BASE__${runtimePublicPath.slice(1)}";
-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 = "") {
-	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;
-	let newCode = code;
-	if (hasRefresh) {
-		const refreshHead = removeLineBreaksIfNeeded(`let prevRefreshReg;
-let prevRefreshSig;
-
-if (import.meta.hot && !inWebWorker) {
-  if (!window.$RefreshReg$) {
-    throw new Error(
-      "${pluginName} can't detect preamble. Something is wrong."
-    );
-  }
-
-  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) => {
-      if (!nextExports) return;
-      const invalidateMessage = RefreshRuntime.validateRefreshBoundaryAndEnqueueUpdate(${JSON.stringify(id)}, currentExports, nextExports);
-      if (invalidateMessage) import.meta.hot.invalidate(invalidateMessage);
-    });
-  });
-}
-`;
-	if (newMap) newMap.mappings = ";;;" + newMap.mappings;
-	return {
-		code: newCode,
-		map: newMap
-	};
-}
-function removeLineBreaksIfNeeded(code, enabled) {
-	return enabled ? code.replace(/\n/g, "") : code;
-}
-
-//#endregion
 //#region src/transforms.ts
 /**
-* Code transformation utilities for fixing React Native package compatibility issues
-*/
-/**
 * Analyzes require statements in code and maps them to module imports.
 * Handles patterns like: varName = require('path').prop or require('path').default
 */
 function analyzeRequireStatements(originalCode, exportedVars) {
 	const importMap = /* @__PURE__ */ new Map();
 	for (const varName of exportedVars) {
-		const requirePattern = new RegExp(`${varName}\\s*=\\s*[\\s\\S]*?require\\(['"]([^'"]+)['"]\\)(?:\\.([\\w]+))?`, "g");
-		const requireMatch = requirePattern.exec(originalCode);
+		const requireMatch = new RegExp(`${varName}\\s*=\\s*[\\s\\S]*?require\\(['"]([^'"]+)['"]\\)(?:\\.([\\w]+))?`, "g").exec(originalCode);
 		if (requireMatch) {
 			const [, modulePath, prop] = requireMatch;
 			const key = `${modulePath}:${prop || "default"}`;
@@ -109,11 +28,6 @@ function analyzeRequireStatements(originalCode, exportedVars) {
 * Removes try/catch blocks that contain require statements and export let declarations.
 * This cleans up the problematic CommonJS patterns.
 */
-function removeTryCatchRequireBlocks(code) {
-	let transformed = code.replace(/try\s*\{[^{}]*?require\([^)]+\)[^{}]*?\}\s*catch[^{}]*?\{[^{}]*?\}/gs, "");
-	transformed = transformed.replace(/export let \w+;/g, "");
-	return transformed;
-}
 /**
 * Generates direct export statements from the import map.
 * Creates modern ESM exports like: export { default as varName } from 'module';
@@ -130,38 +44,60 @@ function generateDirectExports(importMap) {
 /**
 * Transforms React Native Reanimated webUtils files to fix problematic
 * export let + try/catch + require patterns by converting them to proper ESM.
-* 
+*
 * This transformation handles the incompatible module patterns in React Native Reanimated
 * that cause build errors in Vite due to mixing CommonJS require() with ESM exports.
 */
-function transformReanimatedWebUtils(toTransform, originalCode, id, isProduction) {
-	if (!isProduction || !id.includes("node_modules/react-native-reanimated") || !id.includes("ReanimatedModule/js-reanimated/webUtils") || !originalCode.includes("export let") || !originalCode.includes("try") || !originalCode.includes("require")) return toTransform;
-	const exportLetMatches = Array.from(originalCode.matchAll(/export let (\w+);/g));
-	const exportedVars = exportLetMatches.map((match) => match[1]);
-	if (exportedVars.length === 0) return toTransform;
-	const importMap = analyzeRequireStatements(originalCode, exportedVars);
-	toTransform = removeTryCatchRequireBlocks(toTransform);
+function transformReanimatedWebUtilsWithMap(code, id, isProduction, opts) {
+	if (!isProduction || !id.includes("node_modules/react-native-reanimated") || !id.includes("ReanimatedModule/js-reanimated/webUtils") || !code.includes("export let") || !code.includes("try") || !code.includes("require")) return {
+		code,
+		map: null,
+		changed: false
+	};
+	const exportedVars = Array.from(code.matchAll(/export let (\w+);/g)).map((match) => match[1]);
+	if (exportedVars.length === 0) return {
+		code,
+		map: null,
+		changed: false
+	};
+	const importMap = analyzeRequireStatements(code, exportedVars);
+	const ms = new MagicString(code);
+	let changed = false;
+	for (const m of code.matchAll(/try\s*\{[^{}]*?require\([^)]+\)[^{}]*?\}\s*catch[^{}]*?\{[^{}]*?\}/gs)) {
+		const start = m.index;
+		const end = start + m[0].length;
+		ms.remove(start, end);
+		changed = true;
+	}
+	for (const m of code.matchAll(/export let \w+;/g)) {
+		const start = m.index;
+		const end = start + m[0].length;
+		ms.remove(start, end);
+		changed = true;
+	}
 	const exports = generateDirectExports(importMap);
-	if (exports) toTransform = `${toTransform}\n${exports}`;
-	return toTransform;
+	if (exports) {
+		ms.append(`\n${exports}`);
+		changed = true;
+	}
+	if (!changed) return {
+		code,
+		map: null,
+		changed: false
+	};
+	return {
+		code: ms.toString(),
+		map: ms.generateMap({
+			source: (opts === null || opts === void 0 ? void 0 : opts.source) ?? id.split("?")[0],
+			includeContent: true,
+			hires: true
+		}),
+		changed: true
+	};
 }
 
 //#endregion
 //#region src/index.ts
-const silenceUseClientWarning = (userConfig) => ({ rollupOptions: { onwarn(warning, defaultHandler) {
-	var _userConfig$build;
-	if (warning.code === "MODULE_LEVEL_DIRECTIVE" && (warning.message.includes("use client") || warning.message.includes("use server"))) return;
-	if (warning.code === "SOURCEMAP_ERROR" && warning.message.includes("resolve original location") && warning.pos === 0) return;
-	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);
-	else defaultHandler(warning);
-} } });
-const _dirname = dirname(fileURLToPath(import.meta.url));
-const refreshRuntimePath = join(_dirname, "refresh-runtime.js");
-let babel;
-async function loadBabel() {
-	if (!babel) babel = await import("@babel/core");
-	return babel;
-}
 const extensions = [
 	".web.js",
 	".web.ts",
@@ -178,45 +114,17 @@ const extensions = [
 ];
 const defaultIncludeRE = /\.[tj]sx?$/;
 const defaultExcludeRE = /\/node_modules\/(?!react-native|@react-native|expo|@expo)/;
-const tsRE = /\.tsx?$/;
-const getInitialOptions = (opts) => {
-	if (opts.jsxRuntime === "classic") if ("rolldownVersion" in vite) return { oxc: { jsx: {
-		runtime: "classic",
-		development: false
-	} } };
-	else return { esbuild: { jsx: "transform" } };
-	else return {
-		esbuild: {
-			jsx: "automatic",
-			jsxImportSource: opts.jsxImportSource
-		},
-		optimizeDeps: "rolldownVersion" in vite ? { rollupOptions: { jsx: { mode: "automatic" } } } : { esbuildOptions: { jsx: "automatic" } }
-	};
-};
 function rnw(opts = {}) {
-	var _opts$babel;
 	const include = opts.include ?? defaultIncludeRE;
 	const exclude = opts.exclude ?? defaultExcludeRE;
 	const filter = createFilter(include, exclude);
-	const jsxImportSource = opts.jsxImportSource ?? "react";
-	const jsxImportRuntime = `${jsxImportSource}/jsx-runtime`;
-	const jsxImportDevRuntime = `${jsxImportSource}/jsx-dev-runtime`;
-	let runningInVite = false;
 	let isProduction = true;
-	let projectRoot = process.cwd();
-	let skipFastRefresh = true;
-	let runPluginOverrides;
-	let staticBabelOptions;
-	const importReactRE = /\bimport\s+(?:\*\s+as\s+)?React\b/;
-	const viteBabel = {
+	const rnwPlugin = {
 		name: "vite:react-native-web-babel",
 		enforce: "pre",
-		config(_userConfig, env) {
-			var _initialOptions$optim;
-			const development = env.mode === "development";
-			const initialOptions = getInitialOptions(opts);
+		config(_userConfig, { mode }) {
+			const development = mode === "development";
 			return {
-				...initialOptions,
 				define: {
 					global: "window",
 					DEV: JSON.stringify(development),
@@ -224,26 +132,25 @@ function rnw(opts = {}) {
 					_frameTimestamp: void 0,
 					_WORKLET: false,
 					__DEV__: JSON.stringify(development),
-					"process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV || env.mode),
+					"process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV || mode),
 					EXPO_OS: JSON.stringify("web"),
 					"process.env.EXPO_OS": JSON.stringify("web"),
 					"global.Error": "Error"
 				},
-				optimizeDeps: {
-					...initialOptions.optimizeDeps,
-					esbuildOptions: {
-						...(_initialOptions$optim = initialOptions.optimizeDeps) === null || _initialOptions$optim === void 0 ? void 0 : _initialOptions$optim.esbuildOptions,
-						resolveExtensions: extensions,
-						loader: { ".js": "jsx" },
-						plugins: [esbuildFlowPlugin(/* @__PURE__ */ new RegExp(/\.(flow|jsx?)$/), (_path) => "jsx")]
-					}
-				},
+				optimizeDeps: { esbuildOptions: {
+					resolveExtensions: extensions,
+					loader: {
+						".js": "jsx",
+						".mjs": "jsx"
+					},
+					plugins: [esbuildFlowPlugin(/* @__PURE__ */ new RegExp(/\.(flow|jsx?)$/), (_path) => "jsx")]
+				} },
 				build: { rollupOptions: {
 					treeshake: "safest",
 					plugins: [{
-						name: "nativewind-fix",
-						async transform(code, id) {
-							if (id.includes("react-native-css-interop")) return { moduleSideEffects: "no-treeshake" };
+						name: "treeshake-fix",
+						async transform(_code, id) {
+							if (id.includes("react-native-css-interop") || id.includes("react-native-css") || id.includes("expo-modules-core")) return { moduleSideEffects: "no-treeshake" };
 						}
 					}]
 				} },
@@ -254,128 +161,23 @@ function rnw(opts = {}) {
 			};
 		},
 		configResolved(config) {
-			runningInVite = true;
-			projectRoot = config.root;
 			isProduction = config.isProduction;
-			skipFastRefresh = isProduction || config.command === "build" || config.server.hmr === false;
-			if ("jsxPure" in opts) config.logger.warnOnce("[@vitejs/plugin-react] jsxPure was removed. You can configure esbuild.jsxSideEffects directly.");
-			const hooks = config.plugins.map((plugin) => {
-				var _plugin$api;
-				return (_plugin$api = plugin.api) === null || _plugin$api === void 0 ? void 0 : _plugin$api.reactBabel;
-			}).filter(defined);
-			if (hooks.length > 0) runPluginOverrides = (babelOptions, context) => {
-				hooks.forEach((hook) => hook(babelOptions, context, config));
-			};
-			else if (typeof opts.babel !== "function") staticBabelOptions = createBabelOptions(opts.babel);
-		},
-		options(options) {
-			if (!runningInVite) {
-				options.jsx = {
-					mode: opts.jsxRuntime,
-					importSource: opts.jsxImportSource
-				};
-				return options;
-			}
 		},
 		transform: {
 			filter: { id: {
 				include: makeIdFiltersToMatchWithQuery(include),
-				exclude: [...exclude ? makeIdFiltersToMatchWithQuery(ensureArray(exclude)) : []]
+				exclude: makeIdFiltersToMatchWithQuery(exclude)
 			} },
 			async handler(code, id, options) {
 				const [filepath] = id.split("?");
-				if (!filepath || !filter(filepath)) return;
-				const ssr = (options === null || options === void 0 ? void 0 : options.ssr) === true;
-				const babelOptions = (() => {
-					if (staticBabelOptions) return staticBabelOptions;
-					const newBabelOptions = createBabelOptions(typeof opts.babel === "function" ? opts.babel(id, { ssr }) : opts.babel);
-					runPluginOverrides === null || runPluginOverrides === void 0 || runPluginOverrides(newBabelOptions, {
-						id,
-						ssr
-					});
-					return newBabelOptions;
-				})();
-				const plugins = [...babelOptions.plugins];
-				const isJSX = filepath.endsWith("x");
-				const useFastRefresh = !skipFastRefresh && !ssr && (isJSX || (opts.jsxRuntime === "classic" ? importReactRE.test(code) : code.includes(jsxImportDevRuntime) || code.includes(jsxImportRuntime)));
-				if (useFastRefresh) plugins.push([await loadPlugin("react-refresh/babel"), { skipEnvCheck: true }]);
-				if (opts.jsxRuntime === "classic" && isJSX) {
-					if (!isProduction) plugins.push(await loadPlugin("@babel/plugin-transform-react-jsx-self"), await loadPlugin("@babel/plugin-transform-react-jsx-source"));
-				}
-				const parserPlugins = [...babelOptions.parserOpts.plugins];
-				if (!filepath.endsWith(".ts")) parserPlugins.push("jsx");
-				if (tsRE.test(filepath)) parserPlugins.push("typescript");
-				const babel$1 = await loadBabel();
-				let toTransform = code;
-				toTransform = transformReanimatedWebUtils(toTransform, code, id, isProduction);
-				const result = await babel$1.transformAsync(toTransform, {
-					...babelOptions,
-					root: projectRoot,
-					filename: id,
-					sourceFileName: filepath,
-					retainLines: getReactCompilerPlugin(plugins) != null ? false : !isProduction && isJSX && opts.jsxRuntime !== "classic",
-					parserOpts: {
-						...babelOptions.parserOpts,
-						sourceType: "module",
-						allowAwaitOutsideFunction: true,
-						plugins: parserPlugins
-					},
-					generatorOpts: {
-						...babelOptions.generatorOpts,
-						importAttributesKeyword: "with",
-						decoratorsBeforeExport: true
-					},
-					plugins,
-					sourceMaps: true
-				});
-				if (result) {
-					if (!useFastRefresh) return {
-						code: result.code,
-						map: result.map
-					};
-					return addRefreshWrapper(result.code, result.map, "@vitejs/plugin-react", id, opts.reactRefreshHost);
-				}
-			}
-		}
-	};
-	const dependencies = [
-		"react",
-		"react-dom",
-		jsxImportDevRuntime,
-		jsxImportRuntime
-	];
-	const staticBabelPlugins = typeof opts.babel === "object" ? ((_opts$babel = opts.babel) === null || _opts$babel === void 0 ? void 0 : _opts$babel.plugins) ?? [] : [];
-	const reactCompilerPlugin = getReactCompilerPlugin(staticBabelPlugins);
-	if (reactCompilerPlugin != null) {
-		const reactCompilerRuntimeModule = getReactCompilerRuntimeModule(reactCompilerPlugin);
-		dependencies.push(reactCompilerRuntimeModule);
-	}
-	const viteReactRefresh = {
-		name: "vite:react-native-web-refresh",
-		enforce: "pre",
-		config: (userConfig) => ({
-			build: silenceUseClientWarning(userConfig),
-			optimizeDeps: { include: dependencies },
-			resolve: { dedupe: ["react", "react-dom"] }
-		}),
-		resolveId: {
-			filter: { id: exactRegex(runtimePublicPath) },
-			handler(id) {
-				if (id === runtimePublicPath) return id;
-			}
-		},
-		load: {
-			filter: { id: exactRegex(runtimePublicPath) },
-			handler(id) {
-				if (id === runtimePublicPath) return readFileSync(refreshRuntimePath, "utf-8").replace(/__README_URL__/g, "https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react");
+				if (!filter(filepath)) return;
+				const transformResult = transformReanimatedWebUtilsWithMap(code, id, isProduction, { source: filepath });
+				if (!transformResult.changed) return null;
+				return {
+					code: transformResult.code,
+					map: transformResult.map
+				};
 			}
-		},
-		transformIndexHtml(_, config) {
-			if (!skipFastRefresh) return [{
-				tag: "script",
-				attrs: { type: "module" },
-				children: getPreambleCode(config.server.config.base)
-			}];
 		}
 	};
 	return [
@@ -383,66 +185,21 @@ function rnw(opts = {}) {
 		{
 			name: "treat-js-files-as-jsx",
 			async transform(code, id) {
-				if (!id.match(/\.js$/)) return null;
-				return vite.transformWithEsbuild(code, id, {
+				if (id.match(/\.js$/) || id.match(/\.mjs$/)) return vite.transformWithEsbuild(code, id, {
 					loader: "jsx",
 					jsx: "automatic"
 				});
+				return null;
 			}
 		},
 		commonjs(),
-		viteBabel,
-		viteReactRefresh
+		rnwPlugin,
+		react({
+			...opts,
+			exclude
+		})
 	];
 }
-rnw.preambleCode = preambleCode;
-const loadedPlugin = /* @__PURE__ */ new Map();
-function loadPlugin(path) {
-	const cached = loadedPlugin.get(path);
-	if (cached) return cached;
-	const promise = import(path).then((module) => {
-		const value = module.default || module;
-		loadedPlugin.set(path, value);
-		return value;
-	});
-	loadedPlugin.set(path, promise);
-	return promise;
-}
-function createBabelOptions(rawOptions) {
-	var _babelOptions$parserO;
-	const babelOptions = {
-		babelrc: false,
-		configFile: false,
-		...rawOptions
-	};
-	babelOptions.plugins || (babelOptions.plugins = []);
-	babelOptions.presets || (babelOptions.presets = []);
-	babelOptions.overrides || (babelOptions.overrides = []);
-	babelOptions.parserOpts || (babelOptions.parserOpts = {});
-	(_babelOptions$parserO = babelOptions.parserOpts).plugins || (_babelOptions$parserO.plugins = []);
-	return babelOptions;
-}
-function defined(value) {
-	return value !== void 0;
-}
-function getReactCompilerPlugin(plugins) {
-	return plugins.find((p) => p === "babel-plugin-react-compiler" || Array.isArray(p) && p[0] === "babel-plugin-react-compiler");
-}
-function getReactCompilerRuntimeModule(plugin) {
-	let moduleName = "react/compiler-runtime";
-	if (Array.isArray(plugin)) {
-		var _plugin$, _plugin$2, _plugin$3;
-		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";
-		else if (typeof ((_plugin$3 = plugin[1]) === null || _plugin$3 === void 0 ? void 0 : _plugin$3.runtimeModule) === "string") {
-			var _plugin$4;
-			moduleName = (_plugin$4 = plugin[1]) === null || _plugin$4 === void 0 ? void 0 : _plugin$4.runtimeModule;
-		}
-	}
-	return moduleName;
-}
-function ensureArray(value) {
-	return Array.isArray(value) ? value : [value];
-}
 
 //#endregion
-export { rnw, silenceUseClientWarning };
+export { rnw };

package/package.json

@@ -1,10 +1,7 @@
 {
-  "version": "0.0.7",
+  "version": "0.0.8-1",
   "name": "vite-plugin-rnw",
   "type": "module",
-  "main": "./dist/index.cjs",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
   "author": "Daniel Williams",
   "description": "Vite plugin for React Native Web",
   "keywords": [
@@ -19,10 +16,7 @@
     "README.md"
   ],
   "exports": {
-    ".": {
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
-    }
+    ".": "./dist/index.js"
   },
   "repository": {
     "type": "git",
@@ -43,12 +37,7 @@
   },
   "devDependencies": {
     "@types/node": "^22",
-    "babel-plugin-react-compiler": "19.1.0-rc.2",
-    "react": "^19.1.0",
-    "react-dom": "^19.1.0",
-    "rolldown": "1.0.0-beta.24",
-    "tsdown": "^0.12.9",
-    "vite": "^7.0.4"
+    "tsdown": "^0.15.12"
   },
   "peerDependencies": {
     "react-native-web": "*",
@@ -56,15 +45,10 @@
     "vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0"
   },
   "dependencies": {
-    "@babel/core": "^7.28.0",
-    "@babel/plugin-transform-flow-strip-types": "^7.27.1",
-    "@babel/plugin-transform-modules-commonjs": "^7.27.1",
-    "@babel/plugin-transform-react-jsx-self": "^7.27.1",
-    "@babel/plugin-transform-react-jsx-source": "^7.27.1",
     "@bunchtogether/vite-plugin-flow": "^1.0.2",
-    "@rolldown/pluginutils": "1.0.0-beta.24",
-    "@types/babel__core": "^7.20.5",
-    "react-refresh": "^0.17.0",
+    "@rolldown/pluginutils": "1.0.0-beta.46",
+    "@vitejs/plugin-react": "^5.1.0",
+    "magic-string": "^0.30.11",
     "vite-plugin-commonjs": "^0.10.4"
   }
 }