Question

我正在尝试构建一个简单的webpack插件，在webpack编译所有内容之前替换文件中的字符串，并在编译后将该字符串放回。

配置如下所示：

{
   files: ['myFile.js'],
   replace: 'myString'
}

基本上我不希望webpack看到myString，所以我用一些唯一的字符串替换它，然后在webpack编译完所有内容后再放回myString。 this answer中命名的插件/加载器不适合我的用例。

我认为不需要加载器，因为我知道哪些文件必须更改，所以我不需要分析每个文件。

我已经阅读了关于插件的文档，但我仍然有点迷失，可能正在做一个非常低效的插件。也许有插件经验的人可以指导我。

Answer 1

我在链接的答案中没有看到string-replace-webpack-plugin。我们使用它来替换需要根据它们部署到哪个环境而更改的字符串。您可以使用test键限制包含要更改的字符串的文件名。

自述文件中的示例：

loaders: [
     // configure replacements for file patterns 
     { 
        test: /index.html$/,
        loader: StringReplacePlugin.replace({
            replacements: [
                {
                    pattern: /<!-- @secret (\w*?) -->/ig,
                    replacement: function (match, p1, offset, string) {
                        return secrets.web[p1];
                    }
                }
            ]})
        }
]

我们做一些简单的事情：

{
    pattern: /_GOOGLE_ID_//ig,
    replacement: function (match, p1, offset, string) {
        return 'my-actual-google-id-for-this-env';
    }
}

Webpack插件，用于在编译之前和之后修改文件

1 个答案: