after adding @angular/pwa to my app
ng add @angular/pwa --project appName
I get error
core.js:34469 Uncaught TypeError: Cannot read property 'id' of undefined at registerNgModuleType
If I in my appName.module.ts remove from imports
ServiceWorkerModule.register("ngsw-worker.js", {
enabled: environment.production
})
app working again.
Angular.json is added
"serviceWorker": true,
"ngswConfigPath": "projects/tol5-admin-app/ngsw-config.json"
Here is my package.json
"private": true,
"dependencies": {
"@angular/animations": "~8.2.5",
"@angular/cdk": "~8.2.2",
"@angular/common": "~8.2.5",
"@angular/compiler": "~8.2.5",
"@angular/core": "~8.2.5",
"@angular/flex-layout": "^8.0.0-beta.27",
"@angular/forms": "~8.2.5",
"@angular/material": "^8.2.2",
"@angular/platform-browser": "~8.2.5",
"@angular/platform-browser-dynamic": "~8.2.5",
"@angular/router": "~8.2.5",
"@angular/service-worker": "~8.2.5",
"@ngrx/effects": "^8.3.0",
"@ngrx/schematics": "^8.4.0",
"@ngrx/store": "^8.3.0",
"@ngrx/store-devtools": "^8.3.0",
"font-awesome": "^4.7.0",
"hammerjs": "^2.0.8",
"jquery": "^3.4.1",
"rxjs": "~6.4.0",
"tslib": "^1.10.0",
"zone.js": "~0.9.1"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.803.4",
"@angular/cli": "~8.3.4",
"@angular/compiler-cli": "~8.2.5",
"@angular/language-service": "~8.2.5",
"@compodoc/compodoc": "^1.1.11",
"@types/node": "~8.9.4",
"codelyzer": "^5.0.0",
"protractor": "~5.4.0",
"rxjs-tslint-rules": "^4.26.1",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
"tslint-angular": "^3.0.2",
"typescript": "~3.5.3",
"webpack-bundle-analyzer": "^3.6.0"
}
}
For me, this issue was related to the VSCode Plugin "Angular Language Service". I upgraded the plugin to the latest, and started getting this error. I am writing a new answer, because I still wanted to use the ALS so here are the steps to resolve it for people who are using ALS (latest) and an older version of angular in my case 8.
Basically what is happening is the new version of ALS uses the IVY engine which creates a bunch of files in node_modules that are not compatible with older versions of angular, so the below steps will fix that.
it happen to me in angular 8 after i move the project and rename the project folder name... the solution was the delete the node_modules folder and reinstall iy with "npm ci" (that use the package-lock.json)
Try with npx ngcc
On Angular 8, I disabled Angular Language Service however, rm-rf node_modules did not work, I just deleted normally on windows. I had to run powershell as administrator then npm install then downgraded Angular Language Service Extention in vs code from 12 to v11.2.13.
It worked for me.
In my case, I was running Angular 8 and my project suddenly stoped working (I assumed after a VS code update v 1.56.2)
I resolved this issue by deactivating a VS Code extension called Angular Language Service and deleting the node_modules folder.
Then i run npm install and my project is working since.
My package json dependencies
{
...
"dependencies": {
"@angular/animations": "8.2.14",
"@angular/cdk": "~8.2.3",
"@angular/common": "8.2.14",
"@angular/compiler": "8.2.14",
"@angular/core": "8.2.14",
"@angular/forms": "8.2.14",
"@angular/http": "7.2.15",
"@angular/platform-browser": "8.2.14",
"@angular/platform-browser-dynamic": "8.2.14",
"@angular/router": "8.2.14",
"@microsoft/applicationinsights-web": "~2.5.5",
"@ng-bootstrap/ng-bootstrap": "5.0.0",
"@ngx-translate/core": "^11.0.1",
"@ngx-translate/http-loader": "^4.0.0",
"angular-archwizard": "^4.0.0",
"animate.css": "^3.7.2",
"bootstrap": "4.4.1",
"chart.js": "2.8.0",
"core-js": "3.5.0",
"crypto-js": "^4.0.0",
"file-saver": "2.0.2",
"flag-icon-css": "^3.4.5",
"moment": "2.24.0",
"ng2-charts": "2.3.0",
"ng2-validation": "^4.2.0",
"ngx-mask": "^8.1.6",
"ngx-progressbar": "2.1.1",
"oidc-client": "1.10.1",
"popper": "1.0.1",
"rxjs": "6.5.3",
"rxjs-compat": "6.5.3",
"tslib": "1.10.0",
"zone.js": "0.10.2"
},
}
disable any editor extension causing the problem. In my case it was angular language service extension for visual studio code, re-install node_modules and restart angular cli and editor.
in 2021 on 8 angular I faced this issue, just removed node_modules and reinstalled it - issue was solved. so:
rm -rf node_modules
npm install
I have the same problem and I have resolved . I find something in node_modules/angular/* , that means Ivy is work, so I disable it in tsconfig.app.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"types": ["node"]
},
"exclude": [
"**/*.spec.ts"
],
"angularCompilerOptions": {
"enableIvy": false
}
}
In my case this error occurred seemingly at random.I had to delete node_modules and reinstall them which fixed the problem.But opening the project runtime discount again has an error
As told by jai, I got this issue when I added a component in the imports section. Components should be in the declarations part. moving the SearchFilterComponent to declarations solved this issue.
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { routes } from './admin-settings-menu-routing';
import { HomeComponent } from './home.component';
import { SearchFilterComponent } from '../dashboard/common/search-filter/search-filter.component';
@NgModule({
declarations: [HomeComponent],
imports: [
CommonModule,
RouterModule.forChild(routes),
SearchFilterComponent //Should not be declared here
],
providers: []
})
export class AdminMenuModule { }
This could happen when you have imported a wrong module inside imports array in module also. One time when working with a reactive forms, I had mistakenly added FormBuilder inside imports rather than ReactiveFormsModule and it gave me the similar error.
Looks like this error could come from multiple reasons.
In my case this error occurred seemingly at random. One moment it was working, and the next moment it wasn't. Known working commits were also broken.
I had to delete node_modules and reinstall them which fixed the problem.
Quick fix. Just make sure only components are declared in components array, only modules imported are in imports array and services should in providers array.
You should run this command to build your angular app ng build --prod and angular will show you the error detail.
In my case, I import wrong library from Angular Material.
ERROR in node_modules/@angular/material/button/button.d.ts:22:22 - error NG6002: Appears in the NgModule.imports of ListeningModule, but could not be resolved to an NgModule class.
This likely means that the library (@angular/material/button) which declares MatButton has not been processed correctly by ngcc, or is not compatible with Angular Ivy. Check if a newer version of the library is available, and update if so. Also consider checking with the library's authors to see if the library is expected to be compatible with Ivy.
This often happens when you've mixed up imports and declarations in the pertinent module (or some other such mix-up).
You might for example have put a component in the imports array, where only modules should be 'declared'.
The component should be in the declarations array.