2017-02-24 137 views
2

Webpack 2與CommonsChunkPlugin相關的問題/說明。Webpack 2 CommonsChunkPlugin供應商軟件包

{ 
    entry: { 
     app: './src/app.ts', 
     vendor: ['some-third-party-lib', 'another-third-party-lib'] 
    }, 
    output: { 
     path: path.resolve(__dirname, 'dist'), 
     filename: '[name].js' 
    }, 
    plugins: [ 
     new webpack.optimize.CommonsChunkPlugin({ 
      name: 'vendor', 
      minChunks: Infinity 
     }) ] 
} 

據我所知,CommonsChunkPlugin跳出即入口點之間共享到一個單獨的束共同的代碼。在上面的片段中,它會說「給我所有入口點'應用程序'和'供應商'之間的共享代碼,並將它們放入vendor塊/文件中。由於vendor既是一個入口點,也是一個共享塊,結果是我的所有第三方庫都以1個文件結尾(vendor.js)。我是否正確理解這一點?

+0

是的,正確!請參閱[Webpack指南](https://webpack.js.org/guides/)以獲得更好的理解。 –

+0

是的webpack指南幫助我達到這個配置,但仍然缺乏一點連接IMO的點。感謝您的確認。 – bingles

回答

0

根據該文件,將minChunks選項CommonsChunkPlugin配置如下:

其中需要包含一個模塊,然後再將其轉移到公地大塊大塊的最低數量。

傳遞Infinity只是創建公用塊,但不會將模塊移入其中。

源:https://webpack.js.org/plugins/commons-chunk-plugin/#options

在您的例子中,CommonsChunkPlugin只會拉出來在vendor入口點指定的塊,並且不會自動檢測其他共享塊。如果刪除minChunks選項,插件會自動包含所有入口點引用的塊。在這種情況下,你只有兩個入口點,所以它沒有什麼區別。

相關問題