2

I am currently using webpack 4 with react loadable to create chunks. It actually chunks depends on the break point. However, vendor size remains same. React loadable is not supporting webpack 4 yet ? or I am missing some setup ?

css actually seems to splited into the chunk, though

{
  output: {
    path: 'tothe path',
    publicPath: `/publicPath/`,
    filename: '[name] + '.js',
    chunkFilename: '[name]',
  },
  resolve: {
    extensions: ['.js', '.json', '.css'],
    alias: aliases
  },

  stats: {
    warnings: false,
    children: false,
  },

  optimization: {

    splitChunks: {
      chunks: "all",
      name: true,
      cacheGroups: {
        common: {
          name: "vendor" + ".js",
          test: /[\\/]node_modules[\\/]/,
          chunks: "all",
          enforce: true,
          reuseExistingChunk: false,
        },
      }
    }
  }
}
fiddlest
  • 1,262
  • 2
  • 17
  • 42

2 Answers2

2

React-loadable doesn't work well with Webpack 4 yet, take a look at this pull request.

There's a fork of react-loadable (by the author of PR), but it didn't work for me either. I had a problem that some components wrapped in Loadable won't load.

Stephen Rauch
  • 47,830
  • 31
  • 106
  • 135
Bohdan Other
  • 164
  • 7
0

@Bohdan Other
I also ran into this problem.

I found that the components can't load all import style. If I remove the style, the component will load normally.

I move all the styles to the entry file as a workaround.

haichao
  • 11
  • 3