使用单个入口点的webpack进行代码拆分

Question

我是webpack的新手，正在尝试弄清楚如何进行代码拆分。 我有一个从react-native-web创建的大捆绑包，我想将其分成两个较小的捆绑包。一个将包含所有的node_modules，另一个将包含我的自定义代码。 请注意，我的应用程序只有一个入口点，目前我不需要动态导入。

我尝试将以下内容添加到我的webpack配置中

优化：{    splitChunks：{      块：“全部”      }    }

这创建了两个包，但是我的应用程序未在浏览器中呈现。我是否必须从第一个捆绑包中引用第二个捆绑包？有人有可行的例子吗？

Answer 1

我找到了解决方法！

我必须添加带有新创建的块名称的chunkFilename，如下所示：

output: {
      filename: '[name].bundle.js',
      chunkFilename: '[name].bundle.js',
      path: path.resolve(__dirname, 'dist')
   },