webpack插件

1>插件分为

内置插件（不需要安装和引用可以直接使用）和第三方插件（需要npm安装，require引用）

2>常用的内置插件

1》UglifyJsPlugin   new webpack.optimize.UglifyHJsPlugin([options])

解析/压缩/美化所有的js chunk（块）

2》DedupPlugin    new webpack.optimizeDedupPlugin()

有些js库有自己的依赖树，并且这些库可能有交叉依赖，DedupPlugin 可以找出他们并删除重复的依赖。

3》NoEmitOnErrorsPlugin  new webpack.NoEmitOnErrorsPlugin()

跳过编译出错的代码并记录，使编译后运行时的包不会发生错误

4》ProvidePlugin   new webpack.ProvidePlugin(definitions)

definitions定义标志符，当遇到指定标志符的时候，自动加载模块

5》CommonsChunkPlugin  new webpack.optimizeDedupPlugin()

提取代码中公共模块，然后将公共模块打包到一个独立的文件中，以便在其他的入口和模块中使用。

3>常用的第三方插件

首先安装插件，插件的版本需要和webpack版本对应，版本不一致会报错。

1》ExtractTextPlugin  var ExtractTextPlugin=require(“extracr-text-webpack-plugin”)

这个插件会提取entry chunk中所有的require（“*.css”），分离出单独的css文件。

2》autoprefixer    var autoprefixer=require(“autoprefixer”)

自动检测兼容性给各个浏览器加个内核前缀的插件

3》HtmlWepbackPlugin  var HtmlWepbackPlugin=require(“html-webpack-plugin”)

重构入口html，动态添加<link>和<script>，在以hash命名的文件上非常有用，因为每次编译都会改变。

4》OpenBrowserPlugin   var OpenBrowserPlugin=require(“Open-browser-webpack-plugin

“)

在webpack启动成功后打开浏览器