'How to expose single modules of an Angular library through public-api.ts as of Angular 13?

I just upgraded an Angular library project from version 11 to 13, and got an error, when trying to run ng build.

At version 11, the setting was the following:

  • I had several smaller modules, each consisting of several components, and directives
  • each module was exposed from the public-api.ts
  • the consumer UI was able to import each module where it was needed

So each modules would be simply

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

And exposed from public-api.ts:

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

This was working just fine with Angular 11, where I used ngcc for building the library. However, after upgrading to Angular 13 (where libraries are built with Ivy partial compilation mode by default), I got an error for the modules above:

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.

So how to expose modules in an Angular library?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source