Webpack插件里怎么在emit阶段修改输出文件内容？

誉琳~ 提问于 2026-03-21 11:54:20 阅读 29

前端

我写了个Webpack插件，想在emit钩子里面改某个bundle的代码，但不知道怎么拿到原始内容再替换掉。

试过用compilation.assets['main.js']取到对象，但直接赋值字符串好像不行，构建就报错了。

compiler.hooks.emit.tap('MyPlugin', (compilation) => {
  const asset = compilation.assets['main.js'];
  // 想在这里把asset的内容替换成修改后的代码
});

我来解答赞 4 收藏

反馈

1 条解答

篷蔚 Dev Lv1

问题在于你需要通过source()方法获取原始内容，然后替换后再用RawSource重新赋值回去。代码如下：

compiler.hooks.emit.tap('MyPlugin', (compilation) => {

  const asset = compilation.assets['main.js'];

  const source = asset.source();

  const newSource = source.replace(/oldText/g, 'newText');

  compilation.assets['main.js'] = new RawSource(newSource);

});

2026-03-21 12:01