list of plugin

config

NormalModuleReplacementPlugin

new webpack.NormalModuleReplacementPlugin(resourceRegExp, newResource)

用newResource 替换用resourceRegExp 匹配到的资源。
如果newResource 用的相对路径，则路径 相对于以前的资源。
如果newResource 用的是函数，预期重写该函数提供的对象的“request”属性。

ContextReplacementPlugin

new webpack.ContextReplacementPlugin(                resourceRegExp,                 [newContentResource],                [newContentRecursive],                [newContentRegExp])

如果资源（或者目录）匹配resourceRegExp ，这个插件替换默认资源，递归标记，或者替换掉由各自分析 newContentResource 、newContentRecursive 、newContentRegExp 得到的正则。
如果 newContentResource 是相对路径，则其路径相对于之前的资源。
如果用的是函数，预期重写该函数提供的对象的“request”属性。

IgnorePlugin

new webpack.IgnorePlugin(requestRegExp, [contextRegExp])

不为所提供的正则表达式匹配到的模块生成模块。

• requestRegExp 匹配请求的正则。
• contextRegExp （可选项）匹配上下文（目录）的正则。

PrefetchPlugin

new webpack.PrefetchPlugin([context], request)

为一个正常模块的请求。这个请求会在打包之前发生。这样会提高效率。

• context 一个目录的绝对路径
• request 一个正常的模块的请求字符串

ResolverPlugin

new webpack.ResolverPlugin(plugins, [types])

应用一个插件（或者一个插件组）到一个或者多个resolvers （types指定的）；
plugins 一个插件（或者一个插件组），它会被用到resolver(s)。
types 一个resolver的类型或者一个resolver的类型数组。（默认[“normal”]，resolver types: normal, context, loader）。例如

new webpack.ResolverPlugin([    new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin("bower.json", ["main"])], ["normal", "loader"])

ResolverPlugin.FileAppendPlugin

…

EnvironmentPlugin

这个插件将允许您通过process.env引用环境变量 。

new webpack.EnvironmentPlugin([  "NODE_ENV"])

在代码中

var env = process.env.NODE_ENV;

output

BannerPlugin

new webpack.BannerPlugin(banner, options)

给每一个chunk顶部加一个banner。
banner 一个字符串，它将被包装在一个注释里。
options.raw 如果为true，banner不会被包在注释里。
options.entryOnly 如果为true，banner只会被添加到入口chunk。

optimize

DedupePlugin

new webpack.optimize.DedupePlugin()

搜索同样或者相似的文件，在output中去重。它会加重入口文件的开销，但会有效地缩小文件的大小。
这不会改变在所有模块的语义。别指望来解决多模块实例。在去重后，它们不会成为一个实例。
注意：在watch模式下不要用它，只有在生产环境中再去用。

LimitChunkCountPlugin

new webpack.optimize.LimitChunkCountPlugin(options)

限制 chunck数量。chunck会被合并只到合适。
options.maxChunks 块的最大数量
ptions.chunkOverhead 以字节为单位的每个块的额外开销
options.entryChunkMultiplicator 入口文件的一个系数(默认10)

MinChunkSizePlugin

new webpack.optimize.MinChunkSizePlugin(options)

合并低于这个最小尺寸的小块。近似大小。
options.minChunkSize： 小于这个数字的块将被合并。

OccurrenceOrderPlugin

new webpack.optimize.OccurrenceOrderPlugin(preferEntry)

给module和 chunk分配id。经常使用的id更低（更短）。这让ids变得可预测的，也可以减小文件体积。建议使用。

UglifyJsPlugin

new webpack.optimize.UglifyJsPlugin([options])

最小化所有JavaScript输出块。 loader切换到轻便模式。你可以传递一个对象，包含UglifyJS选项。你可以传递一个包含UglifyJS选项的对象。

new webpack.optimize.UglifyJsPlugin({    compress: {        warnings: false    }})

其他选项：
sourceMap : 插件使用SourceMaps 标出出错模块的位置。会减慢编译速度。（默认true）。
test, include, exclude ：正则或者正则数组。用来筛选处理过的文件。（默认：test: /.js($|\?)/i）

重整名称配置
关于重整的变量名的具体配置。默认情况 mangle选项是on.但是你可以传递一个列表自己配置插件。

new webpack.optimize.UglifyJsPlugin({    mangle: {        except: ['$super', '$', 'exports', 'require']    }})

用了这个配置，webpack不会损坏 “ $super”, “$”, ‘exports’ 或者 ‘require’这些关键词。

ngAnnotatePlugin

new ngAnnotatePlugin([options]);

运行ng-annotate pre-minimizer 来插入angular的依赖注入。

CommonsChunkPlugin

new webpack.optimize.CommonsChunkPlugin(options)

• options.name 或options.names (string 或[string]): commons chunk的名称。传入一个已经存在的块名，这个块儿会被选中。如果传递一个字符串数组，这等于多次调用插件为每个块名称。如果省略并且设置了options.async 或 options.children 所有chunk都会被选中。否则options.name会被作为一个块名。
• options.filename(string) ： 公共块的文件名模板。可以像output.filename一样包含同一占位符 。如果省略，源文件名不会变（一般是output.filename或者output.chunkFilename）。
• options.minChunks(number|Infinity|function(module, count) -> boolean): chunk数量的最低值。这些chunk在它被移到 公共块前需要包含一个模块。这个值必须大于2小于chunk总数。
• options.chunks (string[]) : 通过chunk名选择源chunk。这个块必须是公共块的子块。如果忽略，所有 入口块都会被选中。
• options.children(boolean)： 如果为真，所有公共chunk的子块都会被选中。
• options.async(boolean|string)： 如果为真，一个新的异步chunk将作为options.name的子块儿和options.chunks的兄弟块儿被创建。它与options.chunks并行加载。
• options.minSize (number): 在公共块创建前所有公共块的最小值。

例子：
1、入口文件的 Common chunk
生成一个额外的包含入口点共享的通用模块的chunk。

new CommonsChunkPlugin({  name: "commons",  // (the commons chunk name)  filename: "commons.js",  // (the filename of the commons chunk)  // minChunks: 3,  // (Modules must be shared between 3 entries)  // chunks: ["pageA", "pageB"],  // (Only use these entries)})

你必须在入口点之前加载这个chunk。

<script src="commons.js" charset="utf-8"></script><script src="entry.bundle.js" charset="utf-8"></script>

2、显式的依赖 chunk
把你的代码折分为依赖和应用。

entry: {  vendor: ["jquery", "other-lib"],  app: "./entry"}new CommonsChunkPlugin({  name: "vendor",  // filename: "vendor.js"  // (Give the chunk a different name)  minChunks: Infinity,  // (with more entries, this ensures that no other module  //  goes into the vendor chunk)})

<script src="vendor.js" charset="utf-8"></script><script src="app.js" charset="utf-8"></script>

注意： 结合长期的缓存，你需要用chunk-manifest-webpack-plugin这个插件来阻止vendor chunk的变化。你还应该使用records 来确保稳定的 模块id。
3、把公共模块移动到父chunk
用了代码分割，子模块可以用到公共模块。你可以把公共模块移动到父模块中。

new CommonsChunkPlugin({  // names: ["app", "subPageA"]  // (choose the chunks, or omit for all chunks)  children: true,  // (select all children of chosen chunks)  // minChunks: 3,  // (3 children must share the module before it's moved)})

4、提取异步公共块儿

new CommonsChunkPlugin({  // names: ["app", "subPageA"]  // (choose the chunks, or omit for all chunks)  children: true,  // (use all children of the chunk)  async: true,  // (create an async commons chunk)  // minChunks: 3,  // (3 children must share the module before it's separated)})