webpack常用插件

 

ProgressPlugin（webpack自带）：用于统计打包进度

Webpack progress using node.js API

IgnorePlugin（webpack自带）：忽略本地的一些模块

https://webpack.js.org/plugins/ignore-plugin/

CleanWebpackPlugin：清理指定目录的文件

http://npm.taobao.org/package/clean-webpack-plugin

DllPlugin（webpack自带）：预打包文件

webpack进阶——DllPlugin优化打包性能（基于vue-cli）

DllReferencePlugin（webpack自带）：项目打包引用预打包生成的文件

webpack进阶——DllPlugin优化打包性能（基于vue-cli）

AssetsWebpackPlugin：为打包生成的js等生成路径引用指引

http://npm.taobao.org/package/assets-webpack-plugin

HappyPack：运用多核加速打包

happypack

ExtractTextPlugin：将打包中的css单独抽离出来

extract-text-webpack-plugin

EnvironmentPlugin（webpack自带）：在webpack层面定义项目中可以使用的全局变量

http://www.css88.com/doc/webpack2/plugins/environment-plugin/

DefinePlugin（webpack自带）：在webpack层面定义项目中可以使用的全局变量 与EnvironmentPlugin的形式不同而已

https://segmentfault.com/a/1190000011530718 、

http://www.css88.com/doc/webpack2/plugins/define-plugin/

ProvidePlugin（webpack自带）：自动加载模块。 任何时候，当 identifier 被当作未赋值的变量时， module 就会自动被加载，并且 identifier 会被这个 module 输出的内容所赋值

http://www.css88.com/doc/webpack2/plugins/define-plugin/

CopyWebpackPlugin：将指定目录的文件赋值到指定目录下

https://www.npmjs.com/package/copy-webpack-plugin1

CommonsChunkPlugin（webpack自带optimize）将部分包单独打包为一个文件，高效利用缓存

webpack进阶——缓存与独立打包

HotModuleReplacementPlugin（webpack自带）：热更新模块

NoEmitOnErrorsPlugin（webpack自带）：在编译出现错误时,使用它来跳过输出阶段。这样可以确保输出资源不会包含错误

https://webpack.js.org/plugins/no-emit-on-errors-plugin/#src/components/Sidebar/Sidebar.jsx

NamedModulesPlugin（webpack自带）：为每个包hash命名

webpack进阶——缓存与独立打包

HtmlWebpackPlugin：webpack打包后自动生成html页面

https://www.npmjs.com/package/html-webpack-plugin

HtmlWebpackIncludeAssetsPlugin：加强版，可以订制访问路径

https://www.npmjs.com/package/html-webpack-include-assets-plugin

ParallelUglifyPlugin：加速压缩

https://www.npmjs.com/package/webpack-parallel-uglify-plugin