关于CommonsChunkPlugin的简单总结

如果在打包时，把所有的文件打包到一个文件里时，有可能这文件会变得很大，而且有些第三方的库却是不常变的，所以，针对这个情况，CommonsChunkPlugin就派上用场了
它是把各个模块中用到的公共模块抽出来，看下简单的使用

    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      filename:'test.js',
      minChunks: 2
    })

如果有filename时，最终生成的文件名为filename
另外还可以这样定义

    new webpack.optimize.CommonsChunkPlugin({
      names: ['vendor','mainfest'],
      minChunks: 2
    })

1.names时不能设置filename

此时是names而不是name，现在加入再定义filename时会报错

image.png

2.name和names区别

name和names的区别，我个人是这样理解的，vendor是抽取出代码中的公共代码，mainfest是抽取出其他的公共代码，比如依赖的webpack的打包代码

3.minChunks

这个值最小是2，它是指，某个模块只要被引用minChunks次就打包到公共js中
另外，单独提一个配置

  output: {
    filename: '[name].[chunkHash:5].js',
    path: path.join(__dirname, './dist'),
    jsonpFunction:'ug'
  }

这是output配置，filename时输出的文件名，即带有hash值，path是输出路径，jsonpFunciton是代表webpack导入包的名字，这个值可以自定义
其他的没深入研究了，未完待续...