angular: Exported array of standalone components cannot be imported
Which @angular/* package(s) are the source of the bug?
Don’t known / other
Is this a regression?
No
Description
I have a library that export multiple component in a const
as advised in the standalone guide:
const LU_SIMPLE_SELECT_COMPONENTS = [
LuSimpleSelectInputComponent,
LuOptionDirective,
LuDisplayerDirective,
LuOptionComponent,
] as const;
Whenever I import this constant from a module or in a component in an application that use my library, I have the following issue:
Value at position 0 in the NgModule.imports of AppModule is not a reference Value could not be determined statically.
If I redefined the same const in the application, it works.
Links
- The library part
- A Stackblitz that reproduce the issue (uncomment line 24 and comment line 23 to make it works)
Please provide a link to a minimal reproduction of the bug
https://stackblitz.com/edit/angular-ivy-5rgxzc?file=src%2Fapp%2Fapp.module.ts
Please provide the exception or error you saw
> Value at position 0 in the NgModule.imports of AppModule is not a reference
> Value could not be determined statically.
Please provide the environment you discovered this bug in (run ng version
)
Angular CLI: 14.1.3
Node: 16.14.2
Package Manager: npm 8.5.0
OS: win32 x64
Angular: 14.1.3
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1401.3
@angular-devkit/build-angular 14.1.3
@angular-devkit/core 14.1.3
@angular-devkit/schematics 14.1.3
@angular/cdk 14.2.7
@schematics/angular 14.1.3
rxjs 7.5.7
typescript 4.7.4
Anything else?
Love Standalone components!
About this issue
- Original URL
- State: open
- Created 2 years ago
- Reactions: 10
- Comments: 20 (2 by maintainers)
Commits related to this issue
- fix(compiler-cli): evaluate const tuple types statically For standalone components it may be beneficial to group multiple declarations into a single array, that can then be imported all at once in `C... — committed to JoostK/angular by JoostK 2 years ago
- fix(core): allow readonly arrays in NgModule imports and exports NgModule should support readonly arrays in `@NgModule.imports` and `@NgModule.exports`. Fixes #48089 — committed to pkozlowski-opensource/angular by pkozlowski-opensource 2 years ago
- fix(compiler-cli): evaluate const tuple types statically (#48091) For standalone components it may be beneficial to group multiple declarations into a single array, that can then be imported all at o... — committed to angular/angular by JoostK 2 years ago
- fix(core): allow readonly arrays in NgModule imports and exports NgModule should support readonly arrays in `@NgModule.imports` and `@NgModule.exports`. Fixes #48089 — committed to pkozlowski-opensource/angular by pkozlowski-opensource 2 years ago
- fix(compiler-cli): evaluate const tuple types statically (#48091) For standalone components it may be beneficial to group multiple declarations into a single array, that can then be imported all at o... — committed to trekladyone/angular by JoostK 2 years ago
exactly, it doesn’t make sence to create an NgModule just to import multiple components. We want to get rit of the NgModules from the libraries, that is the whole point in the first place 😃
@greg-md just to clarify, I think @hakimio is saying that an app that uses
NgModule
s isn’t able to import a read only array of components (like from a library). It would be taking a step backwards for that library to have to export a shared module, when their aim is going fully standalone.@hakimio for ng modules I think you can create a shared module to import instead.
If I understood ur idea, U want to use components like this:
and avoid “Unable to import component ComponentNameHere.”
I solved it via:
Ah thnx…missed that one
https://github.com/angular/angular/issues/52615#issuecomment-1802670101 @pkozlowski-opensource
@cvandradg No, the issue reported here is that a readonly array of standalone components can not be imported in
NgModule
. The Angular team recommended “best practice” described in the docs does not work.@AndrewKushnir This should not be closed until PR #48106 is merged. At this point even when using Angular v15.1, readonly array of standalone components can not be imported.
Thanks for the reminder, that was on the back of my mind 😃