如何在 Angular 5 中减少供应商/脚本 bundle.js

Question

我已经习惯于ng build -prod -aot -vc -cc -dop --buildOptimize减少构建的应用程序的大小。现在这是我的情况：

是否可以减少（或拆分）这些更大的块？有什么可以帮助我检查这些模块内部的东西吗？

Ps 我已经使用webpack-analyzer来检查情况，但它无法深入这些文件。

Answer 1

使用源映射构建您的应用程序，然后使用像 source-map-explorer 这样的工具来详细说明您正在使用的库的每个部分的大小。

常用库的一些提示：

• 如果您使用 RxJS 5.5 或更高版本，请使用.pipe(operator1(), operator2())语法，当您不使用许多不同的运算符时，它会显着减少 RxJS 的大小
• 如果您使用的是 moment.js，请确保仅导入您正在使用的语言环境
• 如果您使用的是 Angular Material，请确保不要导入未使用的模块
• 如果您使用引导程序和 SASS，请仅导入.scss文件所需的部分

如果您还没有这样做，请将您的应用程序划分为惰性模块，它将减少初始块的大小。