webpack中的loader和plugin

loader

• webpack只能打包commonjs规范的js代码，对于css代码和图片都无法打包，因此要引入第三方工具来进行打包，就是loader，用来完成压缩，打包，翻译
• loader就是用于打包的
• 执行顺序
  • 从右到左，从下到上
    loader仅是为了打包

plugin

• plugin也扩展了webpack的功能，但是plugin是直接应用在webpack本身的，不仅局限在打包，资源的加载上，功能要更加丰富，从打包优化和压缩，到重新定义环境变量，功能十分强大。
• 插件可以携带参数，所以在plugin属性传入new实例
• 常用plugin：
  • html-webpack-plugin:完成html文件的拷贝，打包，还给html中自动增加了引入打包后的js代码。（<script src=""></script>），还能指明把js文件引入到html文件的底部等等。

运行时机：loader运行在打包文件之前（loader为在模块加载时的预处理文件）
plugin：在整个编译周期都起作用

仅用于学习记录，侵删。