webpack 4 react loadable 不会根据卡点拆分供应商 [英] webpack 4 react loadable is not spliting vendor base on chucking point

问题描述

我目前正在使用带有可加载反应的 webpack 4 来创建块.它实际上块取决于断点.但是，供应商规模保持不变.React loadable 还不支持 webpack 4 吗?或者我缺少一些设置?

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实际上似乎分成了块

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,
        },
      }
    }
  }
}

推荐答案

React-loadable 还不能很好地与 Webpack 4 配合使用，看看这个拉取请求.

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

有一个 fork react-loadable(由作者公关)，但它对我也不起作用.我遇到了一个问题，一些包裹在 Loadable 中的组件无法加载.

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.

这篇关于webpack 4 react loadable 不会根据卡点拆分供应商的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！