angular - 使用 Angular Cli 减小 PrimeNg 库的大小

Question

PrimeNg 是一个包含许多组件的大型库。我的 Angular 应用程序只使用了其中的几个组件。我正在使用 AngularCLI 来构建这个应用程序。当我构建它时，vendor.bundle 包含 primeng 库的全部内容。这会产生巨大的包大小 (~4MB)。

如何只包含必要的组件而不是完整的库？

Answer 1

一般我们使用如下语法导入PrimeNg组件

从 'primeng/primeng' 导入 {DataTableModule,SharedModule};

当我们引用这个公共(public)命名空间时，它会在 vendor.bundle.js 中拉取整个库

取而代之的是，从特定模块中拉取它，从'primeng/components/datatable/datatable'导入{DataTableModule，}；
从 'primeng/components/common/shared' 导入 { SharedModule };

这将只在 vendor.bundle.js 中包含引用的组件(及其依赖项)

要找到您的相关路径，请下载 PrimeNg 代码 (https://github.com/primefaces/primeng) 并检查“primeng.d.ts”文件中列出的组件列表。