Webpack 加载器与插件；有什么不同？

Question

webpack 中的 loader 和 plugins 有什么区别？

插件的文档 只是说：

使用插件添加通常与 webpack 中的捆绑包相关的功能。

我知道 babel 使用加载程序进行 jsx/es2015 转换，但看起来其他常见任务（例如 copy-webpack-plugin）使用插件代替。

原文由 Tim Perkins 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

当您在代码中使用诸如 require("my-loader!./my-awesome-module") 之类的东西时，加载程序会对几乎任何文件格式进行预处理转换。与插件相比，它们非常简单，因为它们 (a) 仅向 webpack 公开一个功能，并且 (b) 无法影响实际的构建过程。

另一方面，插件可以深入集成到 webpack 中，因为它们可以在 webpacks 构建系统中注册钩子并访问（和修改）编译器，以及它的工作方式和编译。因此，它们更强大，但也更难维护。

原文由 helt 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

添加补充和更简单的答案。

装载机：

加载程序在生成 包 期间 或 之前 在单个文件级别工作。

插件：

插件在 包 或 块 级别工作，通常在包生成过程 结束 时工作。插件还可以修改包本身的创建方式。插件比加载器有更强大的控制。

举个例子，你可以在下图中清楚地看到加载器在哪里工作以及插件在哪里工作 -

参考资料： 文章 和 图片

原文由 WitVault 发布，翻译遵循 CC BY-SA 3.0 许可协议