如何构建一个大型 Angular 库

Mau*_*cca 1 angular-cli angular ng-packagr

我正在创建一个非常大的 Angular 库。因为我有很多类和组件,所以我将它们结构化为层次结构。例如,我有:

  • 地图
    • 面板
      • 工具栏
      • 主面板
      • ETC。
    • 层数
      • 必应层
      • WMS层
      • WMTS层
    • 几何形状
      • 观点
      • 线
      • 多边形等

在 中public_api.ts,我有许多导出,每个component/module/service我想在库上公开的导出都有一个,但这会扁平化我的层次结构。

我发现维护层次结构的唯一方法是为层次结构树上的每个组创建一个库。例如,面板库(Panels-lib)、图层库(Layers-lib)等,然后复制文件系统上的层次结构,将每个库放在单独的文件夹中:面板文件夹、图层文件夹ETC。

这样,在主应用程序中我可以通过这种方式导入组件:

import {ToolBar} from "MyMap/Panels/Panels-lib";
import {Line} from "MyMap/Geometries/Geometries-lib";
Run Code Online (Sandbox Code Playgroud)

有更好的方法来实现这一目标吗?先感谢您。

Kun*_*vič 7

我认为这篇文章可以帮助https://medium.com/angular-in-depth/improve-spa-performance-by-splitting-your-angular-libraries-in-multiple-chunks-8c68103692d0

以下是如何通过多个入口点以最有效的方式设置库导出:

在此输入图像描述

另请查看他们如何构建Angular Material 组件存储库,作为参考。