Importing standalone components from lib into other lib's module breaks build

[TomTomB]

Type of Issue

[x] Bug Report
[ ] Feature Request

Description

The build breaks as sone as angular standalone components are added to another lib's ngModule via spreaded array.

   libs/other-lib/src/lib/other-lib.module.ts:7:12 - error NG1010: Value at position 1 in the NgModule.imports of OtherLibModule is not a reference
     Value could not be determined statically.

   7   imports: [CommonModule, ...STANDALONE_COMPS],
                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

     libs/other-lib/src/lib/other-lib.module.ts:7:27
       7   imports: [CommonModule, ...STANDALONE_COMPS],
                                   ~~~~~~~~~~~~~~~~~~~
       Unable to evaluate an invalid expression.

Corresponding issue inside the nrwl nx repo: nrwl/nx#11451
Workaround: nrwl/nx#11451 (comment)

How To Reproduce

The following is a nrwl nx repo which used buildable libraries. This process uses ng-packagr under the hood.

https://github.com/TomTomB/nx-ng-standalone-comps-issue

• Clone the repo
• Run npm install
• Run npm run ng build

Expected Behaviour

This should work in the same way as e.g. spreading a (non standalone) components array into the ngModule's delarations.

Version Information

$ node_modules/.bin/ng-packagr --version
ng-packagr: ~14.1.0
@angular/*: ~14.1.0
typescript: 4.7.4
rxjs: ~7.5.6
node: 16.x
npm/yarn: yarn@3.2.1 (PnP disabled)
nx: 14.5.4

[JoostK]

This error is expected; the value of the STANDALONE_COMPS array is only visible within the same compilation unit, not to downstream compilations that consume the lib through its .d.ts declaration files. The standalone docs also mention this:

As an alternative to publishing a NgModule, library authors might want to export an array of cooperating directives:

export CAROUSEL_DIRECTIVES = [ImageCarouselComponent, ImageSlideComponent] as const;
Such an array could be imported by applications using NgModules and added to the @NgModule.imports. Please note the presence of the TypeScript’s as const construct: it gives Angular compiler additional information required for proper compilation and is a recommended practice (as it makes the exported array immutable from the TypeScript point of view

[TomTomB]

Adding as const results in the same error.
I've updated the sample repo to include this.

[JoostK]

I can't look into it further now as I'm on vacation without a laptop, so can't test with the repro from mobile for now.

[TomTomB]

This is fine, since there's a pretty easy workaround for now. Have a great vacation.

[montella1507]

Hi @JoostK any news regarding this issue, please?

[JoostK]

This turned out to be missing support from the AOT compiler which has been addressed in angular/angular#48091.

^{I cannot close issues in this repo. EDIT I can now!}

[github-actions]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

_{This action has been performed automatically by a bot.}