如何提取React库来分离bundle？

Question

是否可以通过Webpack 4提取React和（或）ReactDOM库来分离bundle？例如，我有React应用程序，其中包含React，ReactDOM和Moment.js包。所以我期待两个捆绑包作为结果：

• react.js = react + react-dom
• main.js =时刻+应用程序组件

如何拆分包取决于包的名称，而不是入口点的使用频率？

Answer 1

嗨@VRSY花了一些时间来理解webpack的SplitChunksPlugins.js我想出了如何编写RegEx来提取特定供应商块中的node_modules。

splitChunks: {
      cacheGroups: {
        vendor: {
          test: /[\\/]node_modules[\\/](react|react-dom)[\\/]/,
          name: 'vendor',
          chunks: 'all',
        }
      }
    }

新块大于30kb

在为模块文件夹名称编写正则表达式之前我犯了一个错误。但是相对路径正则表达式是匹配正则表达式的好选择。