English

CC 4.0 许可证

本节内容源自以下链接的内容，并受 CC BY 4.0 许可证的约束。
https://webpack.js.cn/plugins/normal-module-replacement-plugin/
除非另有说明，以下内容可以认为是基于原始内容的修改和删除的结果。

NormalModuleReplacementPlugin

NormalModuleReplacementPlugin 允许你将与 resourceRegExp 匹配的资源替换为 newResource。

new rspack.NormalModuleReplacementPlugin(resourceRegExp, newResource);

如果 newResource 是相对路径，它将相对于先前资源解析。

如果 newResource 是一个函数，则它将覆盖提供的资源的 request 属性。

这对于在不同构建之间允许不同的行为很有用。

提示

请注意，resourceRegExp 在 beforeResolve 阶段针对 request 进行测试，在 afterResolve 阶段针对 resource 进行测试。

此外，请注意，在使用 Windows 时，你必须适应不同的文件夹分隔符符号。例如，/src/environments/environment.ts/ 在 Windows 上无法正常工作，你必须使用 /src[\\/]environments[\\/]environment\.ts/ 代替。

基本示例

在构建生产环境时替换特定模块。

假设你有一个配置文件 some/path/config.development.js 以及一个用于生产环境的特殊版本 some/path/config.production.js

在构建生产环境时添加以下插件

new rspack.NormalModuleReplacementPlugin(
  /some\/path\/config\.development\.js/,
  './config.production.js',
);

高级示例

根据指定的环境进行条件构建。

假设你想要一个具有针对不同构建目标的特定值的配置。

module.exports = function getRspackConfig(env) {
  const appTarget = env.APP_TARGET || 'VERSION_A';
  return {
    plugins: [
      new rspack.NormalModuleReplacementPlugin(
        /(.*)-APP_TARGET(\.*)/,
        function (resource) {
          resource.request = resource.request.replace(
            /-APP_TARGET/,
            `-${appTarget}`,
          );
        },
      ),
    ],
  };
};

创建两个配置文件

app/config-VERSION_A.js

export const config = {
  title: 'I am version A',
};

app/config-VERSION_B.js

export const config = {
  title: 'I am version B',
};

然后使用你在正则表达式中查找的关键字导入该配置

import { config } from './app/config-APP_TARGET';
console.log(config.title);

现在，根据你构建的特定目标，会导入正确的配置

rspack --env APP_TARGET=VERSION_A
=> 'I am version A'

rspack --env APP_TARGET=VERSION_B
=> 'I am version B'

本页内容

NormalModuleReplacementPlugin#

基本示例#

高级示例#

NormalModuleReplacementPlugin

基本示例

高级示例