ng build fails after injecting Keycloak, but ng serve works fine #59837
Description
Which @angular/* package(s) are the source of the bug?
compiler, compiler-cli
Is this a regression?
Yes
Description
I have recently upgraded to Angular 19 and the corresponding keycloak-angular module. After replacing the legacy KeycloakService with Keycloak, ng serve works fine, but ng build failes with an error during AotCompilation: TypeError: Cannot read properties of undefined (reading 'Symbol(patchedReferencedAliases)')
Please find attached our project. I have taken our project and deleted most parts of it, but the bug is still reproducible. I have left some stuff that i could not easily delete.
frontend.zip
npm install
npx ng serve # works
npx ng build # errorPlease provide a link to a minimal reproduction of the bug
https://github.com/user-attachments/files/18639967/frontend.zip
Please provide the exception or error you saw
$ npx ng build
Application bundle generation failed. [1.933 seconds]
X [ERROR] Angular compilation emit failed. [plugin angular-compiler]
TypeError: Cannot read properties of undefined (reading 'Symbol(patchedReferencedAliases)')
at loadIsReferencedAliasDeclarationPatch (file:///C:/tmp/frontend/node_modules/@angular/compiler-cli/bundles/chunk-WKHF7UQD.js:1568:49)
at file:///C:/tmp/frontend/node_modules/@angular/compiler-cli/bundles/chunk-WKHF7UQD.js:1623:35
at transformation (C:\tmp\frontend\node_modules\typescript\lib\typescript.js:118855:14)
at transformNodes (C:\tmp\frontend\node_modules\typescript\lib\typescript.js:118863:70)
at Object.transform (C:\tmp\frontend\node_modules\typescript\lib\typescript.js:152762:18)
at AotCompilation.emitAffectedFiles (C:\tmp\frontend\node_modules\@angular\build\src\tools\angular\compilation\aot-compilation.js:272:58)
at emit (C:\tmp\frontend\node_modules\@angular\build\src\tools\angular\compilation\parallel-worker.js:95:37)
at C:\tmp\frontend\node_modules\piscina\dist\worker.js:144:32
Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 19.1.5
Node: 20.18.0
Package Manager: npm 11.1.0
OS: win32 x64
Angular: 19.1.4
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1901.5
@angular-devkit/build-angular 19.1.5
@angular-devkit/core 19.1.5
@angular-devkit/schematics 19.1.5
@angular/cli 19.1.5
@schematics/angular 19.1.5
rxjs 7.8.1
typescript 5.7.3
zone.js 0.15.0
Anything else?
I found a workaround to make the project build again: Replace the constructor-injection of keycloak: Keycloak with property-injection private keycloak: Keycloak = inject(Keycloak) outside of the constructor.
Replace (search for keycloak: Keycloak, 3 locations):
constructor(
private benutzerInfoService: BenutzerInfoService,
private keycloak: Keycloak
) {With this workaround:
private keycloak: Keycloak = inject(Keycloak);
constructor(
private benutzerInfoService: BenutzerInfoService
) {Since property-injection and constructor-injection should conceptionally be the same, I fear this bug might resurface and bite us later, therefore I am not satisfied with this workaround.