HOW-TO：Angular 库分为独立的功能子库

Question

我目前正在开发一个 Angular 库（在 Angular v 8.1.0 中）并且想知道怎么可能"split in different sub-libraries"?

例如，Angular (@angular) 以某种方式拆分为不同的 "parts"，例如：

@angular/common
@angular/core
@angular/forms
等等

例如，@angular/common 有不同的子目录可供导入：

@angular/common/http
@angular/common/locale
@angular/common/testing

我想知道如何在我自己的 Angular 库中进行这种结构化以使不同的上下文元素彼此独立。假设我的库名为 cool-lib 并且有不同的功能模块包含它们自己的 services/components/etc：common、featureA、featureB.

我想实现这样的目标：

import { CommonService } from 'cool-lib/common';
import { FeatAComponent, FeatAService } from 'cool-lib/feature-a';
import { FeatBModule } from 'cool-lib/feature-b';

而不是：

import { 
  CommonService, 
  FeatAComponent, 
  FeatAService,
  FeatBModule
} from 'cool-lib';

甚至能够独立地增加不同功能模块的版本号或者只安装那些需要的功能模块而不必安装整个库（假设我只需要featureA).

例如，我的 package.json:

{
  "dependencies": {
    "cool-lib/common": "1.0.0",
    "cool-lib/feature-a": "1.0.0",
    "cool-lib/feature-b": "1.3.0"
  }
}

或者只是：

{
  "dependencies": {
    "cool-lib/feature-a": "1.0.0"
  }
}

而不是：

{
  "dependencies": {
    "cool-lib": "1.0.0"
  }
}

到目前为止，我已经阅读了很多关于创建 Angular 库的内容，但是找不到这个特定的用例，因为它们都涵盖了在 npm 上创建和发布它们的最基础知识...所以非常欢迎任何帮助！

Answer 1

Angular 已经支持开箱即用的多个子库。

默认项目结构包含一个 "app" 应用程序，它是一个常规 Angular 项目，然后您添加额外的 sub-库 是 Angular 个库项目。有放在library子文件夹里。

一个Angular项目可以包含多个子库项目。

每个子库项目都可以作为单独的 npm 包发布，因为它们有自己的 package.json 文件。

npm 支持称为 scoped 包名称的东西。这允许您将包命名为 @angular/core，其中 @angular 是包的范围。

您可以像这样将范围库添加到当前的 Angular 项目。

ng generate library @my-scope/my-library

当您从范围项目导入时，它必须以范围为前缀。

例如；

import { CommonService } from '@cool-lib/common';
import { FeatAComponent, FeatAService } from '@cool-lib/feature-a';
import { FeatBModule } from '@cool-lib/feature-b';

在上面，名称@cool-lib是范围，common是npm包的名称。

使用范围可以让你做两件基本的事情（据我所知）。

防止名称与其他包冲突，例如 @cool-lib/animations 不会与 @angular/animations
将包组织成 node_modules/@cool-lib

HOW-TO：Angular 库分为独立的功能子库

HOW-TO: Angular library divided in independent feature sub libraries

javascript

typescript

angular

angular-library

ng-packagr