angular: [Angular 10] Mat Dialog throws error after production deployment
🐞 bug report
Affected Package
I’ve recently upgraded to Angular 10. The issue is caused by package @angular/core.
Is this a regression?
I never faced this issue in previous versions.
Description
I have a dialog component and inside which I’ll be loading other few components (say A, B, C). Now when I remove all component’s selectors & have only text alone in my dialog component, it renders successfully. But if I use the selector of A, B & C’s component, then it is throwing the below error.
During error, only half the dialog width is rendered & contents inside that has not loaded at all. It throws exception in core.js file as below.
ERROR TypeError: Cannot read property 'selectors' of null
I get this error only when using ng build --prod
or ng serve --prod
. (ie, only when using --prod). Issue didn’t appear in normal ng serve in development mode. Hence there is no way I can reproduce this issue in stackblitz.
Our project is a bit complex and we did not find the exact cause of the issue due to which I could not able to create new repository to reproduce the issue. The error message thrown is not so helpful due to which I am helpless.
🔥 Exception or Error
ERROR TypeError: Cannot read property 'selectors' of null
at core.js:8052
at so (core.js:7854)
at core.js:13632
at Module.gl (core.js:13668)
at template (my-dialog.component.html:1)
at Xi (core.js:7329)
at Wi (core.js:7138)
at ko (core.js:8382)
at core.js:6997
at Wi (core.js:7163)
🌍 Your Environment
Angular Version:
Angular CLI: 10.0.1
Node: 10.15.0
OS: win32 x64
Angular: 10.0.2
... animations, cdk, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.1000.1
@angular-devkit/build-angular 0.1000.1
@angular-devkit/build-optimizer 0.1000.1
@angular-devkit/build-webpack 0.1000.1
@angular-devkit/core 10.0.1
@angular-devkit/schematics 10.0.1
@angular/cli 10.0.1
@angular/material 10.0.1
@ngtools/webpack 10.0.1
@schematics/angular 10.0.1
@schematics/update 0.1000.1
rxjs 6.5.5
typescript 3.9.6
webpack 4.43.0
Anything else relevant? #37323 <- this ticket seems similar to my issue but unfortunately it’s been closed because of lack of information. Please do comment if you need any other information from my side.
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Reactions: 1
- Comments: 15 (7 by maintainers)
I am also facing this same issue.
@atscott
I CLEARLY TOLD, it can’t be reproduced in stackblitz since it’s occurring only when doing build --prod. There is no proper error thrown hence we couldn’t find the root cause. Without knowing the actual problem how can you expect it to be reproduced in new github repo?
I’ve told you the exception error & I am ready to debug each line by line in core.js file as well & tell you at which line in your core.js file is throwing exception. What else you need?
Please do re-open the issue.
@kbtganesh Those
ɵɵupdateSyntheticHostBinding
errors smell like an issue with multiple versions of@angular/core
. This can either be because of symlinks into a different tree where there’s anode_modules
folder in scope, which will result in that@angular/core
package installed in thatnode_modules
folder to be resolved for the symlinked library. Alternatively, it may be that you have multiple versions installed because of incompatibledependencies
requirements (which should typically bepeerDependencies
, but not all libraries do this correctly).@petebacondarwin,
It just introduced new errors 😦
I’ve tried updating angular material to latest version, clear npm cache, update ‘npm’ to latest version, remove nodemodule+package lock & did npm install again. Nothing worked.
I’ve seen the similar issue here https://github.com/angular/angular/issues/29564#issuecomment-508063442 and you said to follow other issue #31394 for instructions to proceed but it didn’t have any instruction at all to get rid of this issue.
Reopening and handing off to ngcc team for further triage. They have been investigating issues similar to this lately. Potentially related to #37878 #38453 @petebacondarwin
Thanks for reporting this issue. However, you didn’t provide sufficient information for us to understand and reproduce the problem. Please check out our submission guidelines to understand why we can’t act on issues that are lacking important information.
If the problem still exists in your application, please open a new issue and follow the instructions in the issue template, including a minimal reproduction in StackBlitz or a GitHub repo.