@unpackjs/plugin-react 1.6.1 → 1.6.2

package/dist/index.cjs

@@ -39,14 +39,19 @@ var import_click_to_component = require("./click-to-component/index.cjs");
 var import_mpa = require("./mpa.cjs");
 const PLUGIN_NAME = "unpack:react";
 const pluginReact = (options = {}) => {
+  const { clickToComponent, reactCompiler } = options;
   return {
     name: PLUGIN_NAME,
     bundlerConfig: async (originalConfig, { unpackConfig, mergeConfig }) => {
       let config = originalConfig;
       config = (0, import_mpa.addMpaSupport)({ config, unpackConfig, mergeConfig });
-      if ((0, import_core.isDev)() && options.clickToComponent) {
+      if ((0, import_core.isDev)() && clickToComponent) {
         config = await (0, import_click_to_component.addClickToComponentSupport)({ config, unpackConfig });
       }
+      if (reactCompiler && !(0, import_core.getUserDepPath)(unpackConfig.root, "react-compiler-runtime")) {
+        import_core.logger.error('Dependency "react-compiler-runtime" not found. Did you install it?');
+        process.exit(1);
+      }
       const isRspack = unpackConfig.bundler === "rspack";
       const jsExclude = [/node_modules[\\/](?!\.unpack)/];
       const swcLoader = isRspack ? "builtin:swc-loader" : require.resolve("swc-loader");
@@ -85,8 +90,22 @@ const pluginReact = (options = {}) => {
             {
               test: /\.(j|t)sx$/,
               exclude: jsExclude,
-              loader: swcLoader,
-              options: getSwcOptions({ tsx: true })
+              use: [
+                {
+                  loader: swcLoader,
+                  options: getSwcOptions({ tsx: true })
+                },
+                reactCompiler && unpackConfig.build?.parallel && {
+                  loader: import_node_path.default.resolve(__dirname, "../../core/dist/thread-loader/index.cjs"),
+                  options: import_core.THREAD_OPTIONS
+                },
+                reactCompiler && {
+                  loader: import_node_path.default.resolve(__dirname, "./react-compiler-loader/index.cjs"),
+                  options: {
+                    target: (0, import_core.getUserDepVersion)(unpackConfig.root, "react").split(".")[0]
+                  }
+                }
+              ].filter(Boolean)
             }
           ]
         },

package/dist/index.d.ts

@@ -2,6 +2,7 @@ import { type UnpackPlugin } from '@unpackjs/core';
 export declare const PLUGIN_NAME = "unpack:react";
 export type PluginReactOptions = {
     clickToComponent?: boolean;
+    reactCompiler?: boolean;
 };
 export declare const pluginReact: (options?: PluginReactOptions) => UnpackPlugin;
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAwB,KAAK,YAAY,EAAsB,MAAM,gBAAgB,CAAA;AAI5F,eAAO,MAAM,WAAW,iBAAiB,CAAA;AAEzC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B,CAAA;AACD,eAAO,MAAM,WAAW,aAAa,kBAAkB,KAAQ,YAkE9D,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAGL,KAAK,YAAY,EAMlB,MAAM,gBAAgB,CAAA;AAIvB,eAAO,MAAM,WAAW,iBAAiB,CAAA;AAEzC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAA;AACD,eAAO,MAAM,WAAW,aAAa,kBAAkB,KAAQ,YAsF9D,CAAA"}

package/dist/index.js

@@ -10,19 +10,32 @@ var __filename = /* @__PURE__ */ getFilename();
 import path2 from "node:path";
 import WebpackReactRefreshPlugin from "@pmmmwh/react-refresh-webpack-plugin";
 import RspackReactRefreshPlugin from "@rspack/plugin-react-refresh";
-import { DEFAULT_BROWSERSLIST, isDev, isDevServer } from "@unpackjs/core";
+import {
+  DEFAULT_BROWSERSLIST,
+  THREAD_OPTIONS,
+  getUserDepPath,
+  getUserDepVersion,
+  isDev,
+  isDevServer,
+  logger
+} from "@unpackjs/core";
 import { addClickToComponentSupport } from "./click-to-component/index.js";
 import { addMpaSupport } from "./mpa.js";
 const PLUGIN_NAME = "unpack:react";
 const pluginReact = (options = {}) => {
+  const { clickToComponent, reactCompiler } = options;
   return {
     name: PLUGIN_NAME,
     bundlerConfig: async (originalConfig, { unpackConfig, mergeConfig }) => {
       let config = originalConfig;
       config = addMpaSupport({ config, unpackConfig, mergeConfig });
-      if (isDev() && options.clickToComponent) {
+      if (isDev() && clickToComponent) {
         config = await addClickToComponentSupport({ config, unpackConfig });
       }
+      if (reactCompiler && !getUserDepPath(unpackConfig.root, "react-compiler-runtime")) {
+        logger.error('Dependency "react-compiler-runtime" not found. Did you install it?');
+        process.exit(1);
+      }
       const isRspack = unpackConfig.bundler === "rspack";
       const jsExclude = [/node_modules[\\/](?!\.unpack)/];
       const swcLoader = isRspack ? "builtin:swc-loader" : require.resolve("swc-loader");
@@ -61,8 +74,22 @@ const pluginReact = (options = {}) => {
             {
               test: /\.(j|t)sx$/,
               exclude: jsExclude,
-              loader: swcLoader,
-              options: getSwcOptions({ tsx: true })
+              use: [
+                {
+                  loader: swcLoader,
+                  options: getSwcOptions({ tsx: true })
+                },
+                reactCompiler && unpackConfig.build?.parallel && {
+                  loader: path2.resolve(__dirname, "../../core/dist/thread-loader/index.cjs"),
+                  options: THREAD_OPTIONS
+                },
+                reactCompiler && {
+                  loader: path2.resolve(__dirname, "./react-compiler-loader/index.cjs"),
+                  options: {
+                    target: getUserDepVersion(unpackConfig.root, "react").split(".")[0]
+                  }
+                }
+              ].filter(Boolean)
             }
           ]
         },

package/dist/react-compiler-loader/index.cjs

@@ -0,0 +1,67 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var react_compiler_loader_exports = {};
+__export(react_compiler_loader_exports, {
+  default: () => reactCompilerLoader
+});
+module.exports = __toCommonJS(react_compiler_loader_exports);
+var babel = __toESM(require("@babel/core"));
+var import_plugin_proposal_decorators = __toESM(require("@babel/plugin-proposal-decorators"));
+var import_plugin_transform_class_properties = __toESM(require("@babel/plugin-transform-class-properties"));
+var import_babel_plugin_react_compiler = __toESM(require("babel-plugin-react-compiler"));
+const defaultBabelParsePlugins = ["jsx", "typescript"];
+async function reactCompilerLoader(input, _inputSourceMap) {
+  const callback = this.async();
+  try {
+    const options = this.getOptions();
+    const result = await babel.transformAsync(input, {
+      sourceFileName: this.resourcePath,
+      filename: this.resourcePath,
+      cloneInputAst: false,
+      plugins: [
+        [import_babel_plugin_react_compiler.default, options],
+        [import_plugin_proposal_decorators.default, { legacy: true }],
+        [import_plugin_transform_class_properties.default]
+      ],
+      parserOpts: {
+        plugins: [...defaultBabelParsePlugins]
+      },
+      ast: false,
+      sourceMaps: true,
+      configFile: false,
+      babelrc: false
+    });
+    if (!result) {
+      throw new TypeError("babel.transformAsync with react compiler plugin returns null");
+    }
+    const { code, map } = result;
+    callback(null, code ?? void 0, map ?? void 0);
+  } catch (e) {
+    callback(e);
+  }
+}

package/dist/react-compiler-loader/index.d.ts

@@ -0,0 +1,5 @@
+export type ReactCompilerLoaderOption = {
+    target: '17' | '18' | '19';
+};
+export default function reactCompilerLoader(this: any, input: string, _inputSourceMap: any): Promise<void>;
+//# sourceMappingURL=index.d.ts.map

package/dist/react-compiler-loader/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react-compiler-loader/index.ts"],"names":[],"mappings":"AAKA,MAAM,MAAM,yBAAyB,GAAG;IACtC,MAAM,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC3B,CAAA;AAMD,wBAA8B,mBAAmB,CAAC,IAAI,KAAA,EAAE,KAAK,EAAE,MAAM,EAAE,eAAe,EAAE,GAAG,iBAiC1F"}

package/dist/react-compiler-loader/index.js

@@ -0,0 +1,47 @@
+import { createRequire } from 'node:module';
+var require = createRequire(import.meta['url']);
+
+import path from "path";
+import { fileURLToPath } from "url";
+var getFilename = () => fileURLToPath(import.meta.url);
+var getDirname = () => path.dirname(getFilename());
+var __dirname = /* @__PURE__ */ getDirname();
+var __filename = /* @__PURE__ */ getFilename();
+import * as babel from "@babel/core";
+import PluginProposalDecorators from "@babel/plugin-proposal-decorators";
+import PluginTransformClassProperties from "@babel/plugin-transform-class-properties";
+import BabelPluginReactCompiler from "babel-plugin-react-compiler";
+const defaultBabelParsePlugins = ["jsx", "typescript"];
+async function reactCompilerLoader(input, _inputSourceMap) {
+  const callback = this.async();
+  try {
+    const options = this.getOptions();
+    const result = await babel.transformAsync(input, {
+      sourceFileName: this.resourcePath,
+      filename: this.resourcePath,
+      cloneInputAst: false,
+      plugins: [
+        [BabelPluginReactCompiler, options],
+        [PluginProposalDecorators, { legacy: true }],
+        [PluginTransformClassProperties]
+      ],
+      parserOpts: {
+        plugins: [...defaultBabelParsePlugins]
+      },
+      ast: false,
+      sourceMaps: true,
+      configFile: false,
+      babelrc: false
+    });
+    if (!result) {
+      throw new TypeError("babel.transformAsync with react compiler plugin returns null");
+    }
+    const { code, map } = result;
+    callback(null, code ?? void 0, map ?? void 0);
+  } catch (e) {
+    callback(e);
+  }
+}
+export {
+  reactCompilerLoader as default
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unpackjs/plugin-react",
-  "version": "1.6.1",
+  "version": "1.6.2",
   "description": "",
   "type": "module",
   "exports": {
@@ -23,15 +23,19 @@
     "access": "public"
   },
   "dependencies": {
+    "@babel/core": "7.26.0",
+    "@babel/plugin-proposal-decorators": "7.25.9",
+    "@babel/plugin-transform-class-properties": "7.25.9",
     "@pmmmwh/react-refresh-webpack-plugin": "0.5.15",
     "@rspack/plugin-react-refresh": "1.0.0",
-    "react-refresh": "0.14.2",
-    "swc-loader": "0.2.6",
-    "@swc/core": "1.7.39",
+    "@swc/core": "1.7.40",
     "@swc/helpers": "0.5.13",
-    "launch-editor": "2.9.1",
+    "babel-plugin-react-compiler": "19.0.0-beta-8a03594-20241020",
     "html-webpack-plugin": "5.6.3",
-    "@unpackjs/core": "^1.6.1"
+    "launch-editor": "2.9.1",
+    "react-refresh": "0.14.2",
+    "swc-loader": "0.2.6",
+    "@unpackjs/core": "^1.6.2"
   },
   "scripts": {
     "dev": "modern build --watch",