Webpack暗黙のベンダーチャンク

Question

暗黙の共通ベンダーチャンクでdocsの後に苦労しています。

私はすべてnode_modulesをベンダーのチャンクに入れたいと思います。 私は1つのエントリポイント（app）を持っていて、いくつかのチャンクがあります。 私が試した：

new webpack.optimize.CommonsChunkPlugin({ 
    name: 'vendors', 
    minChunks: module => module.context && module.context.includes('node_modules'), 
}), 

- >は、エントリチャンク（app.chunk.js）からすべてのnode_modulesを取り除きますが

new webpack.optimize.CommonsChunkPlugin({ 
    name: 'app', 
    async: 'vendors', 
    children: true, 
    minChunks: module => module.context && module.context.includes('node_modules'), 
}), 

子供にnode_modulesの葉 - すべての子供たちのチャンクから>ストリップnode_modulesではなく、アプリケーションから...

両方の方法（すべてのチャンクからnode_modulesを取り除き、vendors.chunk.jsに入れる）を探しています。事前に

おかげで、

PS：出力を分析するためにhttps://chrisbateman.github.io/webpack-visualizer/を使用して

Answer 1

は、私はそれを動作させるために管理：

プラグインの

最初の使用は、モジュールが3倍以上を使用抽出

new webpack.optimize.CommonsChunkPlugin({ 
    name: 'client', 
    async: 'common', 
    children: true, 
    minChunks: (module, count) => { 
     if (module.resource && (/^.*\.(css|scss)$/).test(module.resource)) { 
     return false; 
     } 
     return count >= 3 && module.context && !module.context.includes('node_modules'); 
    }, 
    }), 
    new webpack.optimize.CommonsChunkPlugin({ 
    name: 'client', 
    children: true, 
    minChunks: module => module.context && module.context.includes('node_modules'), 
    }), 
    new webpack.optimize.CommonsChunkPlugin({ 
    name: 'vendors', 
    minChunks: module => module.context && module.context.includes('node_modules'), 
    }), 

（node_modulesとcss/scssを除く）共通のチャンクにコードベースで移動します。

2番目のプラグインを使用すると、チャンクからエントリチャンクへnode_modulesが抽出されます。

3番目のプラグインを使用すると、エントリチャンクからnode_modulesチャンクにnode_modulesが抽出されます。