webpack - 自定义 Webpack 插件：访问转换代码的钩子

Question

在 webpack 插件中的某个加载器完成其工作后，我正在尝试获取加载器转换的文件内容。这对于另一个加载器来说通常是理想的，但我还需要访问在翻译过程结束时调用的钩子（因此选择编写插件）。我是否需要一个不同的钩子，emit以及可以访问转换后的文件内容的参数的属性是什么？

    compiler.plugin('done', () => {
       // some finalization code
    });

    compiler.plugin('emit', (compilation, callback) => {
      compilation.chunks.forEach((chunk) => {
        chunk.forEachModule((module) => {
          let filename = module.resource;
          // I could load filename from the filesystem, but I need the content
          // of the file that's gone through the loader pipeline (ideally
          // after a certain loader, but I think at the end of the
          // pipeline would also be fine).
        })
     });

我正在使用 webpack 3，但我应该能够从 webpack 4 解决方案进行翻译。

Answer 1

我最终编写了一个插件，它动态地注入了一个加载器after-resolve（你必须手动检查你想在哪个“模块”中注入加载器以及它的位置），并且还为done事件安装了一个钩子以将所有内容写入磁盘。