从 Angular 13 开始，如何通过 public-api.ts 公开 Angular 库的单个模块？

Question

我刚刚将 Angular 库项目从版本 11 升级到 13，并在尝试运行ng build.

在版本 11 中，设置如下：

• 我有几个较小的模块，每个模块由多个组件和指令组成
• 每个模块都从public-api.ts
• 消费者 UI 能够在需要的地方导入每个模块

所以每个模块都很简单

@NgModule({
  declarations: [AComponent],
  imports: [],
  exports: [AComponent],
})
export class AModule {}

@NgModule({
  declarations: [BComponent],
  imports: [],
  exports: [BComponent],
})
export class BModule {}

并从 public-api.ts 公开：

export { AModule } from './lib/acomponent/a.module';
export { BModule } from './lib/bcomponent/b.module';

这在 Angular 11 中运行得很好，我在其中使用 ngcc 来构建库。但是，升级到 Angular 13（默认情况下使用 Ivy 部分编译模式构建库）后，我收到上述模块的错误：

error Unsupported private class AComponent. This class is visible to consumers via AModule -> AComponent, but is not exported from the top-level library entrypoint.

error Unsupported private class BComponent. This class is visible to consumers via BModule -> BComponent, but is not exported from the top-level library entrypoint.

那么如何公开 Angular 库中的模块呢？

Answer 1

您还需要通过 public-api 导出组件：

export { AModule } from './lib/acomponent/a.module';
export { AComponent } from './lib/acomponent/a.component';
export { BModule } from './lib/bcomponent/b.module';
export { BComponent } from './lib/bcomponent/b.component';