@rsbuild/plugin-react 0.0.17 → 0.0.18

package/dist/index.d.ts

@@ -1,2 +1,5 @@
-import type { RsbuildPlugin } from '@rsbuild/core';
-export declare const pluginReact: () => RsbuildPlugin;
+import { RsbuildPlugin } from '@rsbuild/core';
+
+declare const pluginReact: () => RsbuildPlugin;
+
+export { pluginReact };

package/dist/index.js

@@ -1,8 +1,13 @@
 "use strict";
+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 __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -15,26 +20,472 @@ var __copyProps = (to, from, except, desc) => {
   }
   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);
+
+// ../core/dist/plugins/splitChunks.js
+var require_splitChunks = __commonJS({
+  "../core/dist/plugins/splitChunks.js"(exports, module2) {
+    "use strict";
+    var __create2 = Object.create;
+    var __defProp2 = Object.defineProperty;
+    var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
+    var __getOwnPropNames2 = Object.getOwnPropertyNames;
+    var __getProtoOf2 = Object.getPrototypeOf;
+    var __hasOwnProp2 = Object.prototype.hasOwnProperty;
+    var __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: true });
+    };
+    var __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from === "object" || typeof from === "function") {
+        for (let key of __getOwnPropNames2(from))
+          if (!__hasOwnProp2.call(to, key) && key !== except)
+            __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      }
+      return to;
+    };
+    var __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
+      // 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 ? __defProp2(target, "default", { value: mod, enumerable: true }) : target,
+      mod
+    ));
+    var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
+    var splitChunks_exports = {};
+    __export2(splitChunks_exports, {
+      createDependenciesRegExp: () => createDependenciesRegExp2,
+      pluginSplitChunks: () => pluginSplitChunks
+    });
+    module2.exports = __toCommonJS2(splitChunks_exports);
+    var import_assert = __toESM2(require("assert"));
+    var import_shared5 = require("@rsbuild/shared");
+    function getUserDefinedCacheGroups(forceSplitting) {
+      const cacheGroups = {};
+      const pairs = Array.isArray(forceSplitting) ? forceSplitting.map(
+        (regexp, index) => [`force-split-${index}`, regexp]
+      ) : Object.entries(forceSplitting);
+      pairs.forEach(([key, regexp]) => {
+        cacheGroups[key] = {
+          test: regexp,
+          name: key,
+          chunks: "all",
+          // Ignore minimum size, minimum chunks and maximum requests and always create chunks for user defined cache group.
+          enforce: true
+        };
+      });
+      return cacheGroups;
+    }
+    var DEPENDENCY_MATCH_TEMPL = /[\\/]node_modules[\\/](<SOURCES>)[\\/]/.source;
+    var createDependenciesRegExp2 = (...dependencies) => {
+      const sources = dependencies.map(
+        (d) => typeof d === "string" ? d : d.source
+      );
+      const expr = DEPENDENCY_MATCH_TEMPL.replace("<SOURCES>", sources.join("|"));
+      return new RegExp(expr);
+    };
+    function splitByExperience2(ctx) {
+      const { override, polyfill, defaultConfig, userDefinedCacheGroups } = ctx;
+      const experienceCacheGroup = {};
+      const packageRegExps = {
+        lodash: createDependenciesRegExp2("lodash", "lodash-es"),
+        axios: createDependenciesRegExp2("axios", /axios-.+/)
+      };
+      if (polyfill === "entry" || polyfill === "usage") {
+        packageRegExps.polyfill = createDependenciesRegExp2(
+          "tslib",
+          "core-js",
+          "@babel/runtime",
+          "@swc/helpers"
+        );
+      }
+      Object.entries(packageRegExps).forEach(([name, test]) => {
+        const key = `lib-${name}`;
+        experienceCacheGroup[key] = {
+          test,
+          priority: 0,
+          name: key,
+          reuseExistingChunk: true
+        };
+      });
+      return {
+        ...defaultConfig,
+        ...override,
+        cacheGroups: {
+          ...defaultConfig.cacheGroups,
+          ...experienceCacheGroup,
+          ...userDefinedCacheGroups,
+          ...override.cacheGroups
+        }
+      };
+    }
+    function splitByModule(ctx) {
+      const { override, userDefinedCacheGroups, defaultConfig } = ctx;
+      return {
+        ...defaultConfig,
+        minSize: 0,
+        maxInitialRequests: Infinity,
+        ...override,
+        cacheGroups: {
+          ...defaultConfig.cacheGroups,
+          ...userDefinedCacheGroups,
+          // Core group
+          vendors: {
+            priority: -10,
+            test: import_shared5.NODE_MODULES_REGEX,
+            // todo: not support in rspack
+            // @ts-expect-error
+            name(module22) {
+              return (0, import_shared5.getPackageNameFromModulePath)(module22.context);
+            }
+          },
+          ...override.cacheGroups
+        }
+      };
+    }
+    function splitBySize(ctx) {
+      var _a, _b;
+      const { override, userDefinedCacheGroups, defaultConfig, rsbuildConfig } = ctx;
+      (0, import_assert.default)(rsbuildConfig.strategy === "split-by-size");
+      return {
+        ...defaultConfig,
+        minSize: (_a = rsbuildConfig.minSize) != null ? _a : 0,
+        maxSize: (_b = rsbuildConfig.maxSize) != null ? _b : Infinity,
+        ...override,
+        cacheGroups: {
+          ...defaultConfig.cacheGroups,
+          ...userDefinedCacheGroups,
+          ...override.cacheGroups
+        }
+      };
+    }
+    function splitCustom(ctx) {
+      const { override, userDefinedCacheGroups, defaultConfig } = ctx;
+      return {
+        ...defaultConfig,
+        ...override,
+        cacheGroups: {
+          ...defaultConfig.cacheGroups,
+          ...userDefinedCacheGroups,
+          ...override.cacheGroups
+        }
+      };
+    }
+    function allInOne(_ctx) {
+      return false;
+    }
+    function singleVendor(ctx) {
+      const { override, defaultConfig, userDefinedCacheGroups } = ctx;
+      const singleVendorCacheGroup = {
+        singleVendor: {
+          test: import_shared5.NODE_MODULES_REGEX,
+          priority: 0,
+          chunks: "all",
+          name: "vendor",
+          enforce: true,
+          reuseExistingChunk: true
+        }
+      };
+      return {
+        ...defaultConfig,
+        ...override,
+        cacheGroups: {
+          ...defaultConfig.cacheGroups,
+          ...singleVendorCacheGroup,
+          ...userDefinedCacheGroups,
+          ...override.cacheGroups
+        }
+      };
+    }
+    var SPLIT_STRATEGY_DISPATCHER = {
+      "split-by-experience": splitByExperience2,
+      "split-by-module": splitByModule,
+      "split-by-size": splitBySize,
+      custom: splitCustom,
+      "all-in-one": allInOne,
+      "single-vendor": singleVendor
+    };
+    function pluginSplitChunks() {
+      return {
+        name: "plugin-split-chunks",
+        setup(api) {
+          api.modifyBundlerChain(
+            async (chain, { isServer, isWebWorker, isServiceWorker }) => {
+              var _a;
+              if (isServer || isWebWorker || isServiceWorker) {
+                chain.optimization.splitChunks(false);
+                if (isWebWorker || isServiceWorker) {
+                  chain.module.parser.merge({
+                    javascript: {
+                      dynamicImportMode: "eager"
+                    }
+                  });
+                }
+                return;
+              }
+              const config = api.getNormalizedConfig();
+              const defaultConfig = {
+                // Optimize both `initial` and `async` chunks
+                chunks: "all",
+                // When chunk size >= 50000 bytes, split it into separate chunk
+                // @ts-expect-error Rspack type missing
+                enforceSizeThreshold: 5e4,
+                cacheGroups: {}
+              };
+              const { chunkSplit } = config.performance;
+              let userDefinedCacheGroups = {};
+              if (chunkSplit.forceSplitting) {
+                userDefinedCacheGroups = getUserDefinedCacheGroups(
+                  chunkSplit.forceSplitting
+                );
+              }
+              const override = chunkSplit.strategy === "custom" ? (
+                // `chunkSplit.splitChunks` compat for Eden
+                (_a = chunkSplit.splitChunks) != null ? _a : chunkSplit.override
+              ) : chunkSplit.override;
+              const splitChunksOptions = await SPLIT_STRATEGY_DISPATCHER[chunkSplit.strategy]({
+                defaultConfig,
+                override: override || {},
+                userDefinedCacheGroups,
+                rsbuildConfig: chunkSplit,
+                rootPath: api.context.rootPath,
+                polyfill: config.output.polyfill
+              });
+              chain.optimization.splitChunks(splitChunksOptions);
+              if (chunkSplit.strategy !== "all-in-one") {
+                chain.optimization.runtimeChunk({
+                  name: import_shared5.RUNTIME_CHUNK_NAME
+                });
+              }
+            }
+          );
+        }
+      };
+    }
+  }
+});
+
+// src/index.ts
 var src_exports = {};
 __export(src_exports, {
   pluginReact: () => pluginReact
 });
 module.exports = __toCommonJS(src_exports);
-var import_antd = require("./antd");
-var import_arco = require("./arco");
-var import_splitChunks = require("./splitChunks");
-var import_react = require("./react");
-const pluginReact = () => ({
+
+// src/antd.ts
+var import_shared = require("@rsbuild/shared");
+var getAntdMajorVersion = (appDirectory) => {
+  try {
+    const pkgJsonPath = require.resolve("antd/package.json", {
+      paths: [appDirectory]
+    });
+    const { version } = require(pkgJsonPath);
+    return Number(version.split(".")[0]);
+  } catch (err) {
+    return null;
+  }
+};
+var applyAntdSupport = (api) => {
+  api.modifyRsbuildConfig((rsbuildConfig) => {
+    var _a, _b, _c;
+    (_a = rsbuildConfig.source) != null ? _a : rsbuildConfig.source = {};
+    if (rsbuildConfig.source.transformImport === false || ((_b = rsbuildConfig.source.transformImport) == null ? void 0 : _b.some(
+      (item) => item.libraryName === "antd"
+    ))) {
+      return;
+    }
+    const antdMajorVersion = getAntdMajorVersion(api.context.rootPath);
+    if (antdMajorVersion && antdMajorVersion < 5) {
+      (_c = rsbuildConfig.source) != null ? _c : rsbuildConfig.source = {};
+      rsbuildConfig.source.transformImport = [
+        ...rsbuildConfig.source.transformImport || [],
+        {
+          libraryName: "antd",
+          libraryDirectory: (0, import_shared.isServerTarget)(api.context.target) ? "lib" : "es",
+          style: true
+        }
+      ];
+    }
+  });
+};
+
+// src/arco.ts
+var import_shared2 = require("@rsbuild/shared");
+var applyArcoSupport = (api) => {
+  const ARCO_NAME = "@arco-design/web-react";
+  const ARCO_ICON = `${ARCO_NAME}/icon`;
+  api.modifyRsbuildConfig((rsbuildConfig) => {
+    const { transformImport = [] } = rsbuildConfig.source || {};
+    if (transformImport === false || !(0, import_shared2.isPackageInstalled)(ARCO_NAME, api.context.rootPath)) {
+      return;
+    }
+    const isUseSSR = (0, import_shared2.isServerTarget)(api.context.target);
+    if (!(transformImport == null ? void 0 : transformImport.some((item) => item.libraryName === ARCO_NAME))) {
+      transformImport.push({
+        libraryName: ARCO_NAME,
+        libraryDirectory: isUseSSR ? "lib" : "es",
+        camelToDashComponentName: false,
+        style: true
+      });
+    }
+    if (!(transformImport == null ? void 0 : transformImport.some((item) => item.libraryName === ARCO_ICON))) {
+      transformImport.push({
+        libraryName: ARCO_ICON,
+        libraryDirectory: isUseSSR ? "react-icon-cjs" : "react-icon",
+        camelToDashComponentName: false
+      });
+    }
+    rsbuildConfig.source || (rsbuildConfig.source = {});
+    rsbuildConfig.source.transformImport = transformImport;
+  });
+};
+
+// src/splitChunks.ts
+var import_splitChunks = __toESM(require_splitChunks());
+var import_shared3 = require("@rsbuild/shared");
+async function splitByExperience(rootPath) {
+  const experienceCacheGroup = {};
+  const packageRegExps = {
+    react: (0, import_splitChunks.createDependenciesRegExp)("react", "react-dom", "scheduler"),
+    router: (0, import_splitChunks.createDependenciesRegExp)(
+      "react-router",
+      "react-router-dom",
+      "@remix-run/router",
+      "history"
+    )
+  };
+  if ((0, import_shared3.isPackageInstalled)("antd", rootPath)) {
+    packageRegExps.antd = (0, import_splitChunks.createDependenciesRegExp)("antd");
+  }
+  if ((0, import_shared3.isPackageInstalled)("@arco-design/web-react", rootPath)) {
+    packageRegExps.arco = (0, import_splitChunks.createDependenciesRegExp)(/@?arco-design/);
+  }
+  if ((0, import_shared3.isPackageInstalled)("@douyinfe/semi-ui", rootPath)) {
+    packageRegExps.semi = (0, import_splitChunks.createDependenciesRegExp)(
+      /@(ies|douyinfe)[\\/]semi-.*/
+    );
+  }
+  Object.entries(packageRegExps).forEach(([name, test]) => {
+    const key = `lib-${name}`;
+    experienceCacheGroup[key] = {
+      test,
+      priority: 0,
+      name: key,
+      reuseExistingChunk: true
+    };
+  });
+  return experienceCacheGroup;
+}
+var applySplitChunksRule = (api) => {
+  api.modifyRsbuildConfig(async (rsbuildConfig) => {
+    const { chunkSplit } = rsbuildConfig.performance || {};
+    if ((chunkSplit == null ? void 0 : chunkSplit.strategy) !== "split-by-experience") {
+      return;
+    }
+    const cacheGroups = await splitByExperience(api.context.rootPath);
+    const override = rsbuildConfig.performance.chunkSplit.override;
+    rsbuildConfig.performance.chunkSplit.override = {
+      cacheGroups: {
+        ...cacheGroups,
+        ...override ? override.cacheGroups : {}
+      },
+      ...override || {}
+    };
+  });
+};
+
+// src/react.ts
+var import_shared4 = require("@rsbuild/shared");
+function getReactRefreshEntry(compiler) {
+  var _a, _b, _c, _d, _e;
+  const hot = (_b = (_a = compiler.options.devServer) == null ? void 0 : _a.hot) != null ? _b : true;
+  const refresh = (_e = (_d = (_c = compiler.options.builtins) == null ? void 0 : _c.react) == null ? void 0 : _d.refresh) != null ? _e : true;
+  if (hot && refresh) {
+    const reactRefreshEntryPath = require.resolve("@rspack/plugin-react-refresh/react-refresh-entry");
+    return reactRefreshEntryPath;
+  }
+  return null;
+}
+var setupCompiler = (compiler) => {
+  if (!(0, import_shared4.isClientCompiler)(compiler)) {
+    return;
+  }
+  const reactRefreshEntry = getReactRefreshEntry(compiler);
+  if (!reactRefreshEntry) {
+    return;
+  }
+  for (const key in compiler.options.entry) {
+    compiler.options.entry[key].import = [
+      reactRefreshEntry,
+      ...compiler.options.entry[key].import || []
+    ];
+  }
+};
+var applyBasicReactSupport = (api) => {
+  api.onAfterCreateCompiler(({ compiler: multiCompiler }) => {
+    if ((0, import_shared4.isProd)()) {
+      return;
+    }
+    if (multiCompiler.compilers) {
+      multiCompiler.compilers.forEach(setupCompiler);
+    } else {
+      setupCompiler(multiCompiler);
+    }
+  });
+  api.modifyBundlerChain(async (chain, { CHAIN_ID, isProd: isProd2, target }) => {
+    const config = api.getNormalizedConfig();
+    const usingHMR = (0, import_shared4.isUsingHMR)(config, { isProd: isProd2, target });
+    const rule = chain.module.rule(CHAIN_ID.RULE.JS);
+    const reactOptions = {
+      development: !isProd2,
+      refresh: usingHMR,
+      runtime: "automatic"
+    };
+    rule.use(CHAIN_ID.USE.SWC).tap((options) => {
+      options.jsc.transform.react = {
+        ...reactOptions
+      };
+      return options;
+    });
+    if (chain.module.rules.has(CHAIN_ID.RULE.JS_DATA_URI)) {
+      chain.module.rule(CHAIN_ID.RULE.JS_DATA_URI).use(CHAIN_ID.USE.SWC).tap((options) => {
+        options.jsc.transform.react = {
+          ...reactOptions
+        };
+        return options;
+      });
+    }
+    if (!usingHMR) {
+      return;
+    }
+    const { default: ReactRefreshRspackPlugin } = await import(
+      // TODO https://github.com/web-infra-dev/rspack/issues/4471
+      "@rspack/plugin-react-refresh"
+    );
+    chain.plugin(CHAIN_ID.PLUGIN.REACT_FAST_REFRESH).use(ReactRefreshRspackPlugin);
+  });
+};
+
+// src/index.ts
+var pluginReact = () => ({
   name: "plugin-react",
   pre: ["plugin-swc"],
   setup(api) {
     if (api.context.bundlerType === "rspack") {
-      (0, import_react.applyBasicReactSupport)(api);
+      applyBasicReactSupport(api);
     }
-    (0, import_antd.applyAntdSupport)(api);
-    (0, import_arco.applyArcoSupport)(api);
-    (0, import_splitChunks.applySplitChunksRule)(api);
+    applyAntdSupport(api);
+    applyArcoSupport(api);
+    applySplitChunksRule(api);
   }
 });
 // Annotate the CommonJS export names for ESM import in node: