Javascript 为每个html（表单）生成单独的bundle.js

我目前正在做一个react SPA项目，我必须用逻辑制作几个表单。每个表单都有相同的组件，也有一些独特的组件。 现在：当客户端选择其中一个表单时，它将使用大的common bundle.js

问题：是否有包装bundle.js每个（网页）表单的解决方案

因为有几个常见的组件，我不想为每个表单创建一个项目，但我想使用更薄的bundle.js文件

---

提前感谢您的建议

通过使用动态导入功能和Webpack，确实可以为每个页面生成单独的捆绑包

我强烈建议您使用

react loadable

（）来处理所有相关的逻辑，因为您需要注意一些问题（比如确保在客户端渲染之前准备好并加载所有包。或者确保您甚至知道这些模块是什么）

但是，您可能会遇到的下一个问题是，即使捆绑包现在变小了，公共位也存在于每个捆绑包中。因此，如果用户访问多个URL，他们必须多次下载

这里有两个选项：

• 在Webpack中配置CommonChunkPlugin，使其具有一个commons模块，该模块通过多个捆绑包共享。这里有一个很好的介绍：（）
• 或者你再等几周，直到Webpack4发布。他们应该有一个插件，为您自动完成所有这些。(). 如果你等不及的话，阿尔法已经出来了，一定很快就要到贝塔去了

---

Ohh，非常感谢您的回答！我意识到兔子洞比我想象的要深，所以这个网页太棒了。：）