配置Webpack为Next JS中的页面组创建捆绑包

Question

我们正在构建一个相当大的应用程序，包含很多页面。这些页面可以分为几个不同的页面组，这些页面组之间共享许多共同的依赖关系，而其他组中的页面则不使用它们。

如果我要绘制一个粗略的简化的依赖关系树，那将是这些事情：

因此，基本上，页面的两个“类” PA和PB具有依存关系，我想按以下方式分成多个包： 在所有页面之间共享依赖项（在这种情况下为D-3），我希望将它们包含在commons捆绑包中；

• 仅在PA捆绑包中的D-1页（D-2和PA）之间共享依赖项；
• 仅在PB捆绑包中的D-4页（D-5和PB）之间共享依赖项；
• 仅由单个页面（D-6）使用的依赖关系，该依赖关系应属于该页面捆绑包的一部分

在当前设置下，由于应用中超过一半的页面使用D-3，D-4和D-5，因此它们被捆绑到commons捆绑包中，因此也可以通过PA类型的页面加载。

是否可以通过next.config.js扩展next.Js的webpack配置以使用optimization.splitChunks通过这种方式生成捆绑包？