庫文件太大，webpack打包時怎麼辦

針對上篇gojs太大的問題的衍生出大文件打包的問題

exclude 設置不經過babel-loader編譯的目錄

寫成從node_modules導入的，就不會出現run慢或者報錯，還很快。這是爲何?
是由於node_modules裏面不會再實時編譯了
那有沒有方法，webpack能夠設置一些不實時編譯的文件

{
        test: /\.js$/,
        loader: 'babel-loader',
        include: [resolve('src')],
        exclude:[
          resolve("src/components/common/gojs")
        ]
      },

exclude能夠排除目錄 ，不用babel-loader編譯

庫很大，要麼分包 ，或異步加載，或單獨引入，不然生成環境打的包會很大

externals設置不打包的文件

打包的時候不打包這個，而後須要在生產環境頁面單獨引入這個script

externals:{
    'go':'go'
}

<script type="text/javascript" src="./static/js/go.js"></script>

add-asset-html-webpack-plugin

add-asset-html-webpack-plugin，能夠配置修改打包後的index.html.
在webpack.prod.config中引入並添加，用法以下：

new AddAssetHtmlPlugin({
    filepath:path.join(__dirname,'src/components/common/gojs/go.js'),
    outputPath:'./static/js',
    publicPath:'./static/js',//script標籤中的路徑前綴
    includeSourcemap:false
})

打包後結果以下：

</div></div>
<script type="text/javascript" src="./static/js/go.js"></script>

CommonsChunkPlugin分包，HtmlWebpackPlugin插入

分包等的時間久點

var chunks = ['manifest', 'vendor', 'gojs', 'app'];
new webpack.optimize.CommonsChunkPlugin({
      name: 'gojs',
      minChunks (module) {
        // any required modules inside node_modules are extracted to vendor
        return (
          module.resource &&
          /go\.js$/.test(module.resource) === 0
        )
      }
    }),
 new HtmlWebpackPlugin({
      filename: config.build.index,
      template: 'index.html',
      inject: true,
      minify: {
        removeComments: true,
        collapseWhitespace: true,
        removeAttributeQuotes: true
      },
      chunks,
      chunksSortMode: function(a, b) {
        return chunks.indexOf(a.names[0]) - chunks.indexOf(b.names[0])
      },
    }),