question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

SplitChunksPlugin fails to split during build

See original GitHub issue

Bug report

webpack build fails due to a change in mini-css-extract-plugin.

webpack: 5.58.0 mini-css-extract-plugin: 2.4.0

Relevant webpack.config.js part:

splitChunks: {
        chunks: 'all',
        cacheGroups: {
          vendor: {
            test: /[\\/]node_modules[\\/]/,
            name: module => module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1]
          }
        }
      }

Actual Behavior

The following errors is thrown during build:

TypeError: Cannot read property '1' of null

Expected Behavior

Build should pass successfully.

How Do We Reproduce?

Clone my repo and attempt to build:

https://github.com/theninthsky/flyingnotes-client/tree/9f5ad8717cb45f995855e363d745248f6b5637e9

Please paste the results of npx webpack-cli info here, and mention other relevant information

Build works perfectly with version 2.3.0.

System: OS: Windows 10 10.0.19043 CPU: (4) x64 Intel® Core™ i3-8130U CPU @ 2.20GHz Memory: 834.43 MB / 3.91 GB Binaries: Node: 14.15.5 - C:\Program Files\nodejs\node.EXE npm: 6.14.11 - C:\Program Files\nodejs\npm.CMD Browsers: Chrome: 94.0.4606.81 Edge: Spartan (44.19041.1023.0), Chromium (94.0.992.38) Internet Explorer: 11.0.19041.1202 Packages: babel-loader: ^8.2.2 => 8.2.2 copy-webpack-plugin: ^9.0.1 => 9.0.1 css-loader: ^6.3.0 => 6.3.0 css-minimizer-webpack-plugin: ^3.1.1 => 3.1.1 eslint-webpack-plugin: ^3.0.1 => 3.0.1 html-webpack-plugin: ^5.3.2 => 5.3.2 postcss-loader: ^6.1.1 => 6.1.1 sass-loader: ^12.1.0 => 12.1.0 webpack: ^5.58.0 => 5.58.0 webpack-cli: ^4.9.0 => 4.9.0 webpack-dev-server: ^4.3.1 => 4.3.1 workbox-webpack-plugin: ^6.3.0 => 6.3.0

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:7 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
twgrahamcommented, Dec 7, 2021

I’ll try to create a demo repo by tomorrow.

1reaction
alexander-akaitcommented, Oct 8, 2021

Expected, please add additional check, not all modules can match.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match

Return value An Array whose contents depend on the presence or absence of the global (g) flag, or null if no matches are found.

So it can be changed due internal changes, please consider to use typescript to avoid these problem in future, feel free to feedback

Read more comments on GitHub >

github_iconTop Results From Across the Web

SplitChunksPlugin not generating chunk for dependencies ...
I'm using the basic configuration provided in the official documentation for my use case (https://webpack.js.org/guides/code-splitting#prevent- ...
Read more >
SplitChunksPlugin - webpack
Webpack will automatically split chunks based on these conditions: ... Meaning if splitting into a chunk does not reduce the size of the...
Read more >
Webpack: An in-depth introduction to SplitChunksPlugin
This article will give you a good introduction to one of the most used plugins in webpack's ecosystem - SplitChunksPlugin.
Read more >
Webpack (v4) Code Splitting using SplitChunksPlugin - Medium
Introduction to code splitting in Webpack v4 and with `import()` function → lazy loading routes ... After the build, you are likely to...
Read more >
Webpack 4 course - part four. Code splitting with ...
SplitChunksPlugin. Thanks to SplitChunksPlugin, you can move certain parts of your application to separate files. If a module is used in more ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found