loader
webpack将一切文件视为模块，但是webpack原生是只能解析js文件，如果想将其他文件也打包的话，就会用到loader。 所以Loader的作用是让webpack拥有了加载和解析非JavaScript文件的能力。
常见loader
- style-loader：将CSS添加到DOM的内联样式标签style里
- css-loader：允许将CSS文件通过require的方式引入，并返回CSS代码
- less-loader：处理less
- sass-loader：处理sass
- postcss-loader：用postcss来处理CSS
- file-loader：分发文件到output目录并返回相对路径
- url-loader 和 file-loader 类似，但是当文件小于设定的limit时可以返回一个Data Url
- html-minify-loader：压缩HTML文件
- babel-loader：把ES6文件转换成ES5文件
plugin
loader 用于转换某些类型的模块，而插件则可以用于执行范围更广的任务。包括：打包优化，资源管理，注入环境变量。
常见插件
- html-webpack-plugin：会在打包结束之后自动创建一个index.html, 并将打包好的JS自动引入到这个文件中
- webpack-dev-server：启动一个本地临时的服务器，可以设置端口，支持热更新
- clean-webpack-plugin：每次打包之前先将指定的文件夹清空再生成新的文件
- copy-webpack-plugin：打包相关的文档（如word等）。文档内容是固定不变的, 只需要将对应的文件拷贝到打包目录中即可
- commons-chunk-plugin：提取公共代码
- define-plugin：定义环境变量