如何识别 Angular 中延迟加载的块文件中的模块

Question

有人可以帮助我在构建应用程序时如何对块进行角度命名吗？我有 7 个惰性模块和一些额外的共享模块，但在构建应用程序后，我可以在 CLI 中看到近 15 个以上的块以及一些组件名称。

我无法理解它到底是如何延迟加载模块并编译它的。我最大的块是 15MB，每次刷新页面时都会加载它，这会导致页面加载延迟。

我尝试搜索这个主题，但没有找到明确的答案，任何建议都会对我有很大帮助。

谢谢。

Answer 1

这是我为您解决这个问题的清单。

1. 首先检查最大的文件是否为

   main.js

   ，如果是，则可以在服务器上启用压缩，使用

   gzip

   或

   brotli

   来减小文件大小

2. 您可以通过将

   vendorChunk

   中的

   true

   设置为

   angular.json

   来提高性能，因为

   main.js

   会被分成两部分，所以并行加载

3. 确保在生产中将

   optimization

   和

   buildOptimizer

   设置为 true

4. 确保您没有延迟加载在网站加载期间加载的主要组件，延迟加载主页是一个坏主意，但延迟加载其他页面是一个好主意

5. 启用

   namedChunks

   为 true，以便您知道哪个块属于哪个延迟加载模块！