Exclude certain module from a chunk webpack 4

Question

How can I specify that I don't want a module in a chunk with webpack 4, let's suppose I don't want lodash in the vendor file (No matter the consequences), what can I do?

This is the actual configuration:

splitChunks: {
  name: 'vendors',
  maxAsyncRequests: 1,
  maxInitialRequests: 2,
  chunks: 'initial',
}

Answer 1

A test can also take a method. This allows a lot of flexibility. For instance..

vendor: {
    test(mod/* , chunk */) {


     // Only node_modules are needed
     if (!mod.context.includes('node_modules')) {
       return false;
     }
     // But not node modules that contain these key words in the path
     if ([ 'lodash', 'react'].some(str => mod.context.includes(str))) {
       return false;
     }
     return true;
   },
   name: 'vendor',
   chunks: 'all',
   reuseExistingChunk: true
 },

Answer 2

You can do it using the negative lookahead:

test: /[\\/]node_modules[\\/]((?!(lodash)).*)[\\/]/

Answer 3

The config for loading all of a project's dependencies from /node_modules into a chunk called vendors looks like this:

optimization: {
    splitChunks: {
        cacheGroups: {
            commons: { test: /[\\/]node_modules[\\/]/, name: "vendors", chunks: "all" }
        }
    }
}

So for your use case, you could modify the RegExp to exclude whatever modules you desire. Of course, the downside is that you have to tangle with regular expressions, and the exact formatting of that particular testing condition is beyond my expertise. I know the documentation on optimization.splitChunks is still pretty sparse so I hope this at least helps point you in the right direction.