Webpack有一些我无法理解的东西.
大多数webpack示例都显示了一个主入口点app.js,它导入Webpack的所有其他反应组件以递归方式构建结果文件.如果有多个入口点,例如pageA.js和pageB.js,我们将它们放入entry参数中的数组中.
然而,我的问题是我的“主要”入口点不使用和导入每个组件.也许只是一些.在PageA上,我可能只导入ComponentA和ComponentB.在PageB上,我可能只导入ComponentB和ComponentC.然后在我的MainPage上的main.js中,我可能只导入ComponentD.
我可以将main.js,PageA和PageB全部放入我的入口点.但这是否意味着我每次有新页面时都必须添加到webpack配置中的条目列表中？
我应该如何使用Webpack处理这种情况？
解决方法
听起来您的设置是一个典型的webpack多页面应用程序,它通常由公共/供应商包(入口点)和每个页面的单独包(入口点)组成,如PageA和PageB.
对于每个页面,您需要先包含公共/供应商包,然后包含特定于页面的包.
<script src="common.js"> <script src="PageA.js">
看一下multiple-entry-points和multiple-commons-chunks.Webpack可以自动提取公共deps并将它们捆绑在一起(第一个例子),或者你可以指定哪些deps应该进入哪个常见的chucks(第二个例子).还可以看看common-chunk-and-vendor-chunk,它完美地解释了常见卡盘的工作原理.
根据您的描述,您的设置与第一个示例(多个入口点)非常相似.
