Webpack loaders vs plugins;有什么区别？

javascript reactjs webpack

2022-08-30 04:14:05

webpack中的加载程序和插件有什么区别？

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

我知道babel使用加载器进行jsx / es2015转换，但看起来其他常见任务（例如复制webpack插件）使用插件。

答案 1

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

装载机：

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

插件：

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

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

参考文献：文章和图片

答案 2

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

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