@backstage/cli 0.28.0-next.2 → 0.29.0-next.0

package/dist/lib/bundler/config.cjs.js

@@ -2,40 +2,34 @@
 
 var path = require('path');
 var chalk = require('chalk');
-var webpack = require('webpack');
+var webpack$1 = require('webpack');
 var ESLintPlugin = require('eslint-webpack-plugin');
 var ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
 var HtmlWebpackPlugin = require('html-webpack-plugin');
-var webpack$1 = require('@module-federation/enhanced/webpack');
-var LinkedPackageResolvePlugin = require('./LinkedPackageResolvePlugin.cjs.js');
+var webpack = require('@module-federation/enhanced/webpack');
 var ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
-var runScriptWebpackPlugin = require('run-script-webpack-plugin');
 var ReactRefreshPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
 var paths = require('../paths.cjs.js');
 var fs = require('fs-extra');
-var getPackages = require('@manypkg/get-packages');
-var cliCommon = require('@backstage/cli-common');
-var nodeExternals = require('webpack-node-externals');
 var optimization = require('./optimization.cjs.js');
 var pickBy = require('lodash/pickBy');
-var entryPoints = require('../entryPoints.cjs.js');
 var run = require('../run.cjs.js');
 var transforms = require('./transforms.cjs.js');
 var version = require('../version.cjs.js');
 var yn = require('yn');
 var hasReactDomClient = require('./hasReactDomClient.cjs.js');
+var linkWorkspaces = require('./linkWorkspaces.cjs.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var chalk__default = /*#__PURE__*/_interopDefaultCompat(chalk);
-var webpack__default = /*#__PURE__*/_interopDefaultCompat(webpack);
+var webpack__default = /*#__PURE__*/_interopDefaultCompat(webpack$1);
 var ESLintPlugin__default = /*#__PURE__*/_interopDefaultCompat(ESLintPlugin);
 var ForkTsCheckerWebpackPlugin__default = /*#__PURE__*/_interopDefaultCompat(ForkTsCheckerWebpackPlugin);
 var HtmlWebpackPlugin__default = /*#__PURE__*/_interopDefaultCompat(HtmlWebpackPlugin);
 var ModuleScopePlugin__default = /*#__PURE__*/_interopDefaultCompat(ModuleScopePlugin);
 var ReactRefreshPlugin__default = /*#__PURE__*/_interopDefaultCompat(ReactRefreshPlugin);
 var fs__default = /*#__PURE__*/_interopDefaultCompat(fs);
-var nodeExternals__default = /*#__PURE__*/_interopDefaultCompat(nodeExternals);
 var pickBy__default = /*#__PURE__*/_interopDefaultCompat(pickBy);
 var yn__default = /*#__PURE__*/_interopDefaultCompat(yn);
 
@@ -84,17 +78,16 @@ async function readBuildInfo() {
     commit: commit ?? "unknown"
   };
 }
-async function createConfig(paths$1, options) {
+async function createConfig(paths, options) {
   const {
     checksEnabled,
     isDev,
     frontendConfig,
     moduleFederation,
-    publicSubPath = ""
+    publicSubPath = "",
+    rspack
   } = options;
   const { plugins, loaders } = transforms.transforms(options);
-  const { packages } = await getPackages.getPackages(paths.paths.targetDir);
-  const externalPkgs = packages.filter((p) => !cliCommon.isChildPath(paths$1.root, p.dir));
   const validBaseUrl = resolveBaseUrl(frontendConfig, moduleFederation);
   let publicPath = validBaseUrl.pathname.replace(/\/$/, "");
   if (publicSubPath) {
@@ -105,40 +98,47 @@ async function createConfig(paths$1, options) {
       options.frontendConfig,
       options.moduleFederation
     );
-    plugins.push(
-      new ReactRefreshPlugin__default.default({
-        overlay: {
-          sockProtocol: "ws",
-          sockHost: host,
-          sockPort: port
-        }
-      })
-    );
+    if (rspack) {
+      const RspackReactRefreshPlugin = require("@rspack/plugin-react-refresh");
+      plugins.push(new RspackReactRefreshPlugin());
+    } else {
+      plugins.push(
+        new ReactRefreshPlugin__default.default({
+          overlay: {
+            sockProtocol: "ws",
+            sockHost: host,
+            sockPort: port
+          }
+        })
+      );
+    }
   }
   if (checksEnabled) {
     plugins.push(
       new ForkTsCheckerWebpackPlugin__default.default({
-        typescript: { configFile: paths$1.targetTsConfig, memoryLimit: 4096 }
+        typescript: { configFile: paths.targetTsConfig, memoryLimit: 4096 }
       }),
       new ESLintPlugin__default.default({
-        context: paths$1.targetPath,
+        context: paths.targetPath,
         files: ["**/*.(ts|tsx|mts|cts|js|jsx|mjs|cjs)"]
       })
     );
   }
+  const bundler = rspack ? rspack : webpack__default.default;
   plugins.push(
-    new webpack.ProvidePlugin({
+    new bundler.ProvidePlugin({
       process: require.resolve("process/browser"),
       Buffer: ["buffer", "Buffer"]
     })
   );
   if (options.moduleFederation?.mode !== "remote") {
     plugins.push(
+      // `rspack.HtmlRspackPlugin` does not support object type `templateParameters` value, `frontendConfig` in this case
       new HtmlWebpackPlugin__default.default({
         meta: {
           "backstage-app-mode": options?.appMode ?? "public"
         },
-        template: paths$1.targetHtml,
+        template: paths.targetHtml,
         templateParameters: {
           publicPath,
           config: frontendConfig
@@ -155,18 +155,19 @@ async function createConfig(paths$1, options) {
         minify: false,
         publicPath: "<%= publicPath %>",
         filename: "index.html.tmpl",
-        template: `raw-loader!${paths$1.targetHtml}`
+        template: `${require.resolve("raw-loader")}!${paths.targetHtml}`
       })
     );
   }
   if (options.moduleFederation) {
     const isRemote = options.moduleFederation?.mode === "remote";
+    const AdaptedModuleFederationPlugin = rspack ? rspack.container.ModuleFederationPlugin : webpack.ModuleFederationPlugin;
     plugins.push(
-      new webpack$1.ModuleFederationPlugin({
+      new AdaptedModuleFederationPlugin({
         ...isRemote && {
           filename: "remoteEntry.js",
           exposes: {
-            ".": paths$1.targetEntry
+            ".": paths.targetEntry
           }
         },
         name: options.moduleFederation.name,
@@ -222,9 +223,12 @@ async function createConfig(paths$1, options) {
   }
   const buildInfo = await readBuildInfo();
   plugins.push(
-    new webpack__default.default.DefinePlugin({
+    new bundler.DefinePlugin({
       "process.env.BUILD_INFO": JSON.stringify(buildInfo),
-      "process.env.APP_CONFIG": webpack__default.default.DefinePlugin.runtimeValue(
+      "process.env.APP_CONFIG": rspack ? (
+        // FIXME: see also https://github.com/web-infra-dev/rspack/issues/5606
+        JSON.stringify(options.getFrontendAppConfigs())
+      ) : bundler.DefinePlugin.runtimeValue(
         () => JSON.stringify(options.getFrontendAppConfigs()),
         true
       ),
@@ -233,11 +237,21 @@ async function createConfig(paths$1, options) {
       "process.env.HAS_REACT_DOM_CLIENT": JSON.stringify(hasReactDomClient.hasReactDomClient())
     })
   );
-  const reactRefreshFiles = [
+  if (options.linkedWorkspace) {
+    plugins.push(
+      ...await linkWorkspaces.createWorkspaceLinkingPlugins(
+        bundler,
+        options.linkedWorkspace
+      )
+    );
+  }
+  const reactRefreshFiles = rspack ? [] : [
     require.resolve(
       "@pmmmwh/react-refresh-webpack-plugin/lib/runtime/RefreshUtils.js"
     ),
-    require.resolve("@pmmmwh/react-refresh-webpack-plugin/overlay/index.js"),
+    require.resolve(
+      "@pmmmwh/react-refresh-webpack-plugin/overlay/index.js"
+    ),
     require.resolve("react-refresh")
   ];
   const mode = isDev ? "development" : "production";
@@ -254,15 +268,16 @@ async function createConfig(paths$1, options) {
     ];
     optimization$1.nodeEnv = false;
     plugins.push(
-      new webpack__default.default.DefinePlugin({
-        "process.env.NODE_ENV": webpack__default.default.DefinePlugin.runtimeValue(
-          ({ module }) => {
-            if (reactPackageDirs.some((val) => module.resource.startsWith(val))) {
-              return '"development"';
-            }
-            return `"${mode}"`;
+      new bundler.DefinePlugin({
+        "process.env.NODE_ENV": rspack ? (
+          // FIXME: see also https://github.com/web-infra-dev/rspack/issues/5606
+          JSON.stringify(mode)
+        ) : webpack__default.default.DefinePlugin.runtimeValue(({ module }) => {
+          if (reactPackageDirs.some((val) => module.resource.startsWith(val))) {
+            return '"development"';
           }
-        )
+          return `"${mode}"`;
+        })
       })
     );
   }
@@ -282,11 +297,11 @@ async function createConfig(paths$1, options) {
       // we check the gzip size instead
     },
     devtool: isDev ? "eval-cheap-module-source-map" : "source-map",
-    context: paths$1.targetPath,
+    context: paths.targetPath,
     entry: [
       require.resolve("@backstage/cli/config/webpack-public-path"),
       ...options.additionalEntryPoints ?? [],
-      paths$1.targetEntry
+      paths.targetEntry
     ],
     resolve: {
       extensions: [".ts", ".tsx", ".mjs", ".js", ".jsx", ".json", ".wasm"],
@@ -307,20 +322,22 @@ async function createConfig(paths$1, options) {
         http: false,
         util: require.resolve("util/")
       },
-      plugins: [
-        new LinkedPackageResolvePlugin.LinkedPackageResolvePlugin(paths$1.rootNodeModules, externalPkgs),
-        new ModuleScopePlugin__default.default(
-          [paths$1.targetSrc, paths$1.targetDev],
-          [paths$1.targetPackageJson, ...reactRefreshFiles]
-        )
-      ]
+      // FIXME: see also https://github.com/web-infra-dev/rspack/issues/3408
+      ...!rspack && {
+        plugins: [
+          new ModuleScopePlugin__default.default(
+            [paths.targetSrc, paths.targetDev],
+            [paths.targetPackageJson, ...reactRefreshFiles]
+          )
+        ]
+      }
     },
     module: {
       rules: loaders
     },
     output: {
       uniqueName: options.moduleFederation?.name,
-      path: paths$1.targetDist,
+      path: paths.targetDist,
       publicPath: options.moduleFederation?.mode === "remote" ? "auto" : `${publicPath}/`,
       filename: isDev ? "[name].js" : "static/[name].[fullhash:8].js",
       chunkFilename: isDev ? "[name].chunk.js" : "static/[name].[chunkhash:8].chunk.js",
@@ -332,137 +349,24 @@ async function createConfig(paths$1, options) {
       } : {}
     },
     experiments: {
-      lazyCompilation: yn__default.default(process.env.EXPERIMENTAL_LAZY_COMPILATION)
+      lazyCompilation: !rspack && yn__default.default(process.env.EXPERIMENTAL_LAZY_COMPILATION),
+      ...rspack && {
+        // We're still using `style-loader` for custom `insert` option
+        css: false
+      }
     },
     plugins,
-    ...withCache ? {
+    ...withCache && {
       cache: {
         type: "filesystem",
         buildDependencies: {
           config: [__filename]
         }
       }
-    } : {}
-  };
-}
-async function createBackendConfig(paths$1, options) {
-  const { checksEnabled, isDev } = options;
-  const { packages } = await getPackages.getPackages(paths.paths.targetDir);
-  const localPackageEntryPoints = packages.flatMap((p) => {
-    const entryPoints$1 = entryPoints.readEntryPoints(p.packageJson);
-    return entryPoints$1.map((e) => path.posix.join(p.packageJson.name, e.mount));
-  });
-  const moduleDirs = packages.map((p) => path.resolve(p.dir, "node_modules"));
-  const externalPkgs = packages.filter((p) => !cliCommon.isChildPath(paths$1.root, p.dir));
-  const { loaders } = transforms.transforms({ ...options, isBackend: true });
-  const runScriptNodeArgs = new Array();
-  if (options.inspectEnabled) {
-    const inspect = typeof options.inspectEnabled === "string" ? `--inspect=${options.inspectEnabled}` : "--inspect";
-    runScriptNodeArgs.push(inspect);
-  } else if (options.inspectBrkEnabled) {
-    const inspect = typeof options.inspectBrkEnabled === "string" ? `--inspect-brk=${options.inspectBrkEnabled}` : "--inspect-brk";
-    runScriptNodeArgs.push(inspect);
-  }
-  if (options.require) {
-    runScriptNodeArgs.push(`--require=${options.require}`);
-  }
-  return {
-    mode: isDev ? "development" : "production",
-    profile: false,
-    ...isDev ? {
-      watch: true,
-      watchOptions: {
-        ignored: /node_modules\/(?!\@backstage)/
-      }
-    } : {},
-    externals: [
-      nodeExternalsWithResolve({
-        modulesDir: paths$1.rootNodeModules,
-        additionalModuleDirs: moduleDirs,
-        allowlist: ["webpack/hot/poll?100", ...localPackageEntryPoints]
-      })
-    ],
-    target: "node",
-    node: {
-      /* eslint-disable-next-line no-restricted-syntax */
-      __dirname: true,
-      __filename: true,
-      global: true
-    },
-    bail: false,
-    performance: {
-      hints: false
-      // we check the gzip size instead
-    },
-    devtool: isDev ? "eval-cheap-module-source-map" : "source-map",
-    context: paths$1.targetPath,
-    entry: [
-      "webpack/hot/poll?100",
-      paths$1.targetRunFile ? paths$1.targetRunFile : paths$1.targetEntry
-    ],
-    resolve: {
-      extensions: [".ts", ".mjs", ".js", ".json"],
-      mainFields: ["main"],
-      modules: [paths$1.rootNodeModules, ...moduleDirs],
-      plugins: [
-        new LinkedPackageResolvePlugin.LinkedPackageResolvePlugin(paths$1.rootNodeModules, externalPkgs),
-        new ModuleScopePlugin__default.default(
-          [paths$1.targetSrc, paths$1.targetDev],
-          [paths$1.targetPackageJson]
-        )
-      ]
-    },
-    module: {
-      rules: loaders
-    },
-    output: {
-      path: paths$1.targetDist,
-      filename: isDev ? "[name].js" : "[name].[hash:8].js",
-      chunkFilename: isDev ? "[name].chunk.js" : "[name].[chunkhash:8].chunk.js",
-      ...isDev ? {
-        devtoolModuleFilenameTemplate: (info) => `file:///${path.resolve(info.absoluteResourcePath).replace(
-          /\\/g,
-          "/"
-        )}`
-      } : {}
-    },
-    plugins: [
-      new runScriptWebpackPlugin.RunScriptWebpackPlugin({
-        name: "main.js",
-        nodeArgs: runScriptNodeArgs.length > 0 ? runScriptNodeArgs : void 0,
-        args: process.argv.slice(3)
-        // drop `node backstage-cli backend:dev`
-      }),
-      new webpack__default.default.HotModuleReplacementPlugin(),
-      ...checksEnabled ? [
-        new ForkTsCheckerWebpackPlugin__default.default({
-          typescript: { configFile: paths$1.targetTsConfig }
-        }),
-        new ESLintPlugin__default.default({
-          files: ["**/*.(ts|tsx|mts|cts|js|jsx|mjs|cjs)"]
-        })
-      ] : []
-    ]
-  };
-}
-function nodeExternalsWithResolve(options) {
-  let currentContext;
-  const externals = nodeExternals__default.default({
-    ...options,
-    importType(request) {
-      const resolved = require.resolve(request, {
-        paths: [currentContext]
-      });
-      return `commonjs ${resolved}`;
     }
-  });
-  return ({ context, request }, callback) => {
-    currentContext = context;
-    return externals(context, request, callback);
   };
 }
 
-exports.createBackendConfig = createBackendConfig;
 exports.createConfig = createConfig;
 exports.resolveBaseUrl = resolveBaseUrl;
 exports.resolveEndpoint = resolveEndpoint;

package/dist/lib/bundler/hasReactDomClient.cjs.js

@@ -1,8 +1,12 @@
 'use strict';
 
+var paths = require('../paths.cjs.js');
+
 function hasReactDomClient() {
   try {
-    require.resolve("react-dom/client");
+    require.resolve("react-dom/client", {
+      paths: [paths.paths.targetDir]
+    });
     return true;
   } catch {
     return false;

package/dist/lib/bundler/linkWorkspaces.cjs.js

@@ -0,0 +1,31 @@
+'use strict';
+
+var path = require('path');
+var getPackages = require('@manypkg/get-packages');
+var paths = require('../paths.cjs.js');
+
+async function createWorkspaceLinkingPlugins(bundler, workspace) {
+  const { packages: linkedPackages, root: linkedRoot } = await getPackages.getPackages(
+    workspace
+  );
+  const replacementRegex = new RegExp(
+    `^(?:${linkedPackages.map((pkg) => pkg.packageJson.name).join("|")})(?:/.*)?$`
+  );
+  return [
+    // Any imports of a package that is present in the linked workspace will
+    // be redirected to be resolved within the context of the linked workspace
+    new bundler.NormalModuleReplacementPlugin(replacementRegex, (resource) => {
+      resource.context = linkedRoot.dir;
+    }),
+    // react and react-dom are always resolved from the target directory
+    // Note: this often requires that the linked and target workspace use the same versions of React
+    new bundler.NormalModuleReplacementPlugin(/^react(?:-dom)?$/, (resource) => {
+      if (!path.relative(linkedRoot.dir, resource.context).startsWith("..")) {
+        resource.context = paths.paths.targetDir;
+      }
+    })
+  ];
+}
+
+exports.createWorkspaceLinkingPlugins = createWorkspaceLinkingPlugins;
+//# sourceMappingURL=linkWorkspaces.cjs.js.map

package/dist/lib/bundler/optimization.cjs.js

@@ -2,21 +2,23 @@
 
 const { EsbuildPlugin } = require("esbuild-loader");
 const optimization = (options) => {
-  const { isDev } = options;
+  const { isDev, rspack } = options;
+  const MinifyPlugin = rspack ? rspack.SwcJsMinimizerRspackPlugin : EsbuildPlugin;
   return {
     minimize: !isDev,
     minimizer: [
-      new EsbuildPlugin({
+      new MinifyPlugin({
         target: "ES2022",
         format: "iife",
         exclude: "remoteEntry.js"
       }),
       // Avoid iife wrapping of module federation remote entry as it breaks the variable assignment
-      new EsbuildPlugin({
+      new MinifyPlugin({
         target: "ES2022",
         format: void 0,
         include: "remoteEntry.js"
-      })
+      }),
+      rspack && new rspack.LightningCssMinimizerRspackPlugin()
     ],
     runtimeChunk: "single",
     splitChunks: {
@@ -42,8 +44,10 @@ const optimization = (options) => {
           priority: 10,
           minSize: 1e5,
           minChunks: 1,
-          maxAsyncRequests: Infinity,
-          maxInitialRequests: Infinity
+          ...!rspack && {
+            maxAsyncRequests: Infinity,
+            maxInitialRequests: Infinity
+          }
         },
         // filename is not included in type, but we need it
         // Group together the smallest modules

package/dist/lib/bundler/server.cjs.js

@@ -81,12 +81,14 @@ DEPRECATION WARNING: React Router Beta is deprecated and support for it will be
       viteServer?.restart();
     }
   });
+  const rspack = process.env.EXPERIMENTAL_RSPACK ? require("@rspack/core") : void 0;
   const commonConfigOptions = {
     ...options,
     checksEnabled: options.checksEnabled,
     isDev: true,
     baseUrl: url,
     frontendConfig,
+    rspack,
     getFrontendAppConfigs: () => {
       return latestFrontendAppConfigs;
     }
@@ -99,22 +101,58 @@ DEPRECATION WARNING: React Router Beta is deprecated and support for it will be
   if (process.env.EXPERIMENTAL_VITE) {
     const vite = require("vite");
     const { default: viteReact } = require("@vitejs/plugin-react");
-    const {
-      nodePolyfills: viteNodePolyfills
-    } = require("vite-plugin-node-polyfills");
+    const { default: viteYaml } = require("@modyfi/vite-plugin-yaml");
+    const { nodePolyfills: viteNodePolyfills } = require("vite-plugin-node-polyfills");
     const { createHtmlPlugin: viteHtml } = require("vite-plugin-html");
     viteServer = await vite.createServer({
       define: {
-        global: "window",
         "process.argv": JSON.stringify(process.argv),
         "process.env.APP_CONFIG": JSON.stringify(cliConfig.frontendAppConfigs),
         // This allows for conditional imports of react-dom/client, since there's no way
         // to check for presence of it in source code without module resolution errors.
         "process.env.HAS_REACT_DOM_CLIENT": JSON.stringify(hasReactDomClient.hasReactDomClient())
       },
+      optimizeDeps: {
+        esbuildOptions: {
+          plugins: [
+            {
+              name: "custom-define",
+              setup(build) {
+                const define = build.initialOptions.define ||= {};
+                define["process.env.HAS_REACT_DOM_CLIENT"] = JSON.stringify(
+                  hasReactDomClient.hasReactDomClient()
+                );
+                define["process.env.NODE_ENV"] = JSON.stringify("development");
+              }
+            }
+          ]
+        }
+      },
       plugins: [
         viteReact(),
-        viteNodePolyfills(),
+        viteNodePolyfills({
+          include: [
+            "buffer",
+            "events",
+            "fs",
+            "http",
+            "https",
+            "os",
+            "path",
+            "process",
+            "querystring",
+            "stream",
+            "url",
+            "util",
+            "zlib"
+          ],
+          globals: {
+            global: true,
+            Buffer: true,
+            process: true
+          }
+        }),
+        viteYaml(),
         viteHtml({
           entry: paths$2.targetEntry,
           // todo(blam): we should look at contributing to thPe plugin here
@@ -136,6 +174,8 @@ DEPRECATION WARNING: React Router Beta is deprecated and support for it will be
       root: paths$2.targetPath
     });
   } else {
+    const bundler = rspack ?? webpack__default.default;
+    const DevServer = rspack ? require("@rspack/dev-server").RspackDevServer : WebpackDevServer__default.default;
     const publicPaths = await paths.resolveOptionalBundlingPaths({
       entry: "src/index-public-experimental",
       dist: "dist/public"
@@ -147,8 +187,8 @@ DEPRECATION WARNING: React Router Beta is deprecated and support for it will be
         )
       );
     }
-    const compiler = publicPaths ? webpack__default.default([config$2, await config$1.createConfig(publicPaths, commonConfigOptions)]) : webpack__default.default(config$2);
-    webpackServer = new WebpackDevServer__default.default(
+    const compiler = publicPaths ? bundler([config$2, await config$1.createConfig(publicPaths, commonConfigOptions)]) : bundler(config$2);
+    webpackServer = new DevServer(
       {
         hot: !process.env.CI,
         devMiddleware: {

package/dist/lib/bundler/transforms.cjs.js

@@ -8,7 +8,8 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var MiniCssExtractPlugin__default = /*#__PURE__*/_interopDefaultCompat(MiniCssExtractPlugin);
 
 const transforms = (options) => {
-  const { isDev, isBackend } = options;
+  const { isDev, isBackend, rspack } = options;
+  const CssExtractRspackPlugin = rspack ? rspack.CssExtractRspackPlugin : MiniCssExtractPlugin__default.default;
   function insertBeforeJssStyles(element) {
     const head = document.head;
     const firstJssNode = head.querySelector("style[data-jss]");
@@ -24,7 +25,7 @@ const transforms = (options) => {
       exclude: /node_modules/,
       use: [
         {
-          loader: require.resolve("swc-loader"),
+          loader: rspack ? "builtin:swc-loader" : require.resolve("swc-loader"),
           options: {
             jsc: {
               target: "es2022",
@@ -50,7 +51,7 @@ const transforms = (options) => {
       exclude: /node_modules/,
       use: [
         {
-          loader: require.resolve("swc-loader"),
+          loader: rspack ? "builtin:swc-loader" : require.resolve("swc-loader"),
           options: {
             jsc: {
               target: "es2022",
@@ -81,7 +82,7 @@ const transforms = (options) => {
       test: [/\.icon\.svg$/],
       use: [
         {
-          loader: require.resolve("swc-loader"),
+          loader: rspack ? "builtin:swc-loader" : require.resolve("swc-loader"),
           options: {
             jsc: {
               target: "es2022",
@@ -143,7 +144,7 @@ const transforms = (options) => {
           options: {
             insert: insertBeforeJssStyles
           }
-        } : MiniCssExtractPlugin__default.default.loader,
+        } : CssExtractRspackPlugin.loader,
         {
           loader: require.resolve("css-loader"),
           options: {
@@ -156,7 +157,7 @@ const transforms = (options) => {
   const plugins = new Array();
   if (!isDev) {
     plugins.push(
-      new MiniCssExtractPlugin__default.default({
+      new CssExtractRspackPlugin({
         filename: "static/[name].[contenthash:8].css",
         chunkFilename: "static/[name].[id].[contenthash:8].css",
         insert: insertBeforeJssStyles