首页 文章

Webpack插件：如何动态地将加载器添加到模块？

提问于
浏览 次
2

我正在写一个Webpack插件 . 在模块解析期间，此插件应为某些模块动态添加特定的加载程序，但不是全部 .

我现在的想法是利用 normal-module-factory 的 after-resolve 事件 . 在那里，我可以修改数组 data.loaders . 一些调试向我显示该数组包含 { loader: string, options: object | undefined } 形式的对象 .

我找不到任何关于动态修改每个模块加载器的文档 . 所以我想知道：

  • 这是正确的方法吗？

  • 一些（但不是全部）现有的 loaders 条目包含一个附加属性 ident ，如下所示： 'ref--0-0' . 我应该何时设置此属性，并使用什么值？

javascript webpack

1 回答

  • 2

    我不确定它是否是最佳解决方案，但此代码似乎有效：

    class MyPlugin {
  apply(compiler) {
    compiler.plugin('normal-module-factory', normalModuleFactory => {
      normalModuleFactory.plugin('after-resolve', (data, callback) => {
        data.loaders.push({
          loader: ..., // Path to loader
          options: {}
        });
        callback(null, data);
      });
    });
  }
}

module.exports = MyPlugin;

    关于额外的 ident 属性：Webpack需要能够比较加载器选项 . 默认情况下，它通过在选项对象上调用 JSON.stringify() ，然后比较生成的字符串来完成此操作 . 通过添加 ident 属性，您可以显式指定选项对象的字符串表示形式 . 有关详细信息，请参阅https://stackoverflow.com/a/49006233/52041 .

    回复于

相关问题