I have an application built with webpack that uses code splitting. I now want to aggregate all common modules that match specific criteria (in this case node_modules
) across all entry chunks and all child chunks (generated via code splitting) into a single separate commons chunk.
If I do this:
new webpack.optimize.CommonsChunkPlugin({
children: true,
async: 'vendor',
minChunks: (module) => {
const isVendor = module.context.split('/').some(dir => dir === 'vendor');
return isVendor;
},
}),
Webpack will aggregate all modules that match the minChunks
function into a separate commons chunk, but only for modules from child chunks—it will not aggregate modules from the entry chunk into the commons chunk. As a result, I have duplicated modules that appear in both my entry chunk and commons chunk.
How is this possible?