webpack v5 and chunk

I'm now into the painful task of upgrading all our JS stack. I did everything, except one: webpack v5 which is causing a heap of problems. I can't really post all my webpack config its a complex and big project. The issue I'm having is related with this error:

You should not use <withRouter(withReducer(EpicInjector)) /> outside a . I've replace with a simple ... to simplify the code, but same error with and that's when barely starting the root app.js: const render = (messages, appComp) => {

    <Provider store={store}>
          <ConnectedRouter history={history}>

It looks like pretty obvious when you search for it, but remember that everything works perfectly well with webpack v4. It trickle down to having 2 instance or react-router, but I think its more than that. When using webpack-bundle-analyzer to see my packages, I saw that my vendor package is almost the same which is good news. But when looking at my app package, its differs a lot. First, webpack v4 creates a 0.chunk.js of about 12mb (I'm in dev) along with an app.js of 6mb. When I check references, all react-router ref are in my vendor dll.js which is exactly what I want. On webpack v5, I get the app.js of 6mb, but no 0.chunk.js. Reference are still pointing to vendor dll.js so all seem fine except for that 12mb chunk file I used to have.

Webpack config are almost the same except for:

optimization: {
  moduleIds: 'named',
  emitOnErrors: false,

and node with fs: 'empty that was replace by:

  fallback: {
    fs: false,
    crypto: require.resolve("crypto-browserify"),
    path: require.resolve("path-browserify"),
    vm: require.resolve("vm-browserify"),

Other are very small details in the configs. I'm searching, what could be wrong and trying all the possible webpack options, but still stuck after a long while and need some help.

Thanks a bunch.

Read more here: https://stackoverflow.com/questions/67928343/webpack-v5-and-chunk

Content Attribution

This content was originally published by ThePainnn at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: