使用Angular Cli减少PrimeNg库的大小

Question

PrimeNg是一个包含许多组件的大型库。我的角度应用程序仅使用其中很少的组件。我正在使用AngularCLI构建此应用程序。当我构建它时，vendor.bundle具有primeng库的全部内容。这使得捆绑包的大小很大（〜4MB）。

如何仅包含必需的组件而不包含完整的库？

Answer 1

通常，我们使用以下语法导入PrimeNg组件

import {DataTableModule,SharedModule} from 'primeng/primeng';

当我们引用该通用名称空间时，它将在vendor.bundle.js中提取整个库

取而代之的是，将其从特定模块中拉出， import { DataTableModule, } from 'primeng/components/datatable/datatable'; import { SharedModule } from 'primeng/components/common/shared';

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

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