Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Sample of Pinterest Mweb webpack configuration
const bundles = {
'vendor-mweb': [
'app/mobile/polyfills.js',
'intl',
'normalizr',
'react-dom',
'react-redux',
'react-router-dom',
'react',
'redux'
],
'entryChunk-webpack': 'app/mobile/runtime.js',
'entryChunk-mobile': 'app/mobile/index.js'
};
const chunkPlugins = [
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor-mweb',
minChunks: Infinity,
chunks: ['entryChunk-mobile']
}),
new webpack.optimize.CommonsChunkPlugin({
name: 'entryChunk-webpack',
minChunks: Infinity,
chunks: ['vendor-mweb']
}),
new webpack.optimize.CommonsChunkPlugin({
children: true,
name: 'entryChunk-mobile',
minChunks: (module, count) => {
return module.resource && (isCommonLib(resource) || count >= 3);
}
})
];
@carlosagsmendes

This comment has been minimized.

Copy link

@carlosagsmendes carlosagsmendes commented Dec 2, 2017

Hi @zackargyle,

I'm trying to create bundles of my vendor dependencies in WebPack and found your gist.

Could you please explain:

  • How do you relate the bundles with the CommonsChunkPlugin?
const bundles = {
  'vendor-mweb': [
    'app/mobile/polyfills.js',
    'intl',
    'normalizr',
    'react-dom',
    'react-redux',
    'react-router-dom',
    'react',
    'redux'
  ],
  'entryChunk-webpack': 'app/mobile/runtime.js',
  'entryChunk-mobile': 'app/mobile/index.js'
};

There's no reference to this on the CommonChunkPlugin. Do you use this to create entry points?

  • What do you consider to be a common lib? (isCommonLib function)

Thanks in advance

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment