webpack经常使用插件

 https://www.jianshu.com/p/08859e5651fc

 

1、html-webpack-plugin

插件的基本做用就是生成html文件。

html-webpack-plugin的一个实例生成一个html文件，若是单页应用中须要多个页面入口，或者多页应用时配置多个html时，那么就须要实例化该插件屡次；

二、extract-text-webpack-plugin

该插件会提取entry chunk中全部的require('*.css')，分离出独立的css文件。

 

5、clean-webpack-plugin

用于在building以前删除你之前build过的文件，清楚dist中重复的文件

 

CommonsChunkPlugin    new webpack.optimize.CommonsChunkPlugin(options)

提取代码中的公共模块，而后将公共模块打包到一个独立的文件中，以便在其余的入口和模块中使用。别忘了在html中单独引入抽离出来的公共模块。

常见的使用场景：

1. 抽离多个entry的公共模块
2. 抽离vendor模块
3. 抽离子模块中的公共模块到父模块中，会增长首屏加载的时间
4. 和3相似，不过不是抽离到父模块，并且额外抽离出一个异步的公共模块

HotModuleReplacementPlugin

模块热替换,若是不在dev-server模式下，须要记录数据，recordPath，生成每一个模块的热更新模块。

 

UglifyJsPlugin

压缩js