Angular Lazyload 路由生成额外的块文件，前缀为 default~pages

Question

我正在尝试为我目前正在处理的项目实施延迟加载路由。一切正常，我没有收到任何错误，当我转到新页面时，我还可以看到新的块文件加载。

但是，除了我预期的块文件之外，cli 还创建了一些带有前缀“default~pages”的额外文件，例如

default~pages-managers--managers-module~pages-hosts-hosts-module~pa~0e1f5bc0

并且default~无论我登陆哪个页面，这些带有前缀的文件都会加载。例如，如果我在主页上，我会同时看到：

pages-home-home-module

和

default~pages-managers--managers-module~pages-hosts-hosts-module~pa~0e1f5bc0

有谁知道这些默认文件是什么以及如何摆脱它们？

Answer 1

希望这可以帮助：

我遇到了与生成的 commonChunks 相同的问题default~ ....。

angular.json在您的（您有...等的地方）使用"aot": true：

"commonChunk": false

Answer 2

此评论是关于 Angular 版本的11.2.1......

这是一个默认功能（设置为true），可以在angular.json文件中配置（Andre Elrico 已经回答了），但我看到保留此默认值有很大的好处（即在网络上加载的包大小和构建时间） 。下面是一个演示：-

有一个共同的块：-

没有公共块：-

Outro：我可以说 - 使用第二种方法，公共模块将与每个单独的延迟加载模块合并。如果这就是您正在寻找的；然后调整文件中的设置angular.json。

请注意：构建时间取决于操作系统、硬件配置等。

Answer 3

我不认为这是你应该担心的事情。当您"optimization": false在构建过程中使用 angular.json 时，此行为是正常的。如果你想优化你的构建。在 angular.json 中添加"optimization": true以下嵌套projects->{your project name}-architect->build->configurations->production。在生产对象中，您应该添加"optimization": true，运行后ng build --configuration=production它将按预期工作。

我假设您只运行ng build或ng build --watch默认情况下没有启用优化器，因此在这种情况下，如果您想启用它并摆脱默认块，您应该将其添加到projects->{your project name}-architect->build. 在构建对象中，添加"optimization": true.

注意：将其添加到手表的构建过程而不是生产构建中会大大减慢您的构建速度，因此我建议您仅在产品构建上启用它。