Angular update 8 to 9: NG6002: Appears in the NgModule.imports of AppModule, but itself has errors

Viewed 2886

I've searching for an answer but could not find any solution that fix the issue.

I have updated version of Angular from version 8 to version 9. Everything worked fine on 8 but after update app does not compile due to error

src/app/groups/groups.module.ts:45:14 - error NG6002: Appears in the NgModule.imports of AppModule, but itself has errors

But this module doe not contain any errors. It's clean as it was in version 8 when it worked. I tried different things:

  1. remove node_modules and re-install packages
  2. close terminal and re-open
  3. close editor(VSC) and re-open
  4. clean cache npm cache clean with and without --force flag
  5. "importHelpers": true, in tsconfig.json file

Components are in declarations, modules in imports, everything is correct and groups.module.ts shows error but file does not contain any errors inside. Modules are imported correctly as well (i.e. import { MatPaginator } from '@angular/material/paginator'; when in version 8 was import { MatPaginator } from '@angular/material'; so regarding those things it is as it's been.

The only thing that helped was disabling Ivy with: "angularCompilerOptions": {"enableIvy": false } but it's pointless to update application if I cannot use improvements.

My package.json file:

"dependencies":{
"@angular-devkit/build-webpack": "~0.901.15",
"@angular/animations": "^9.1.13",
"@angular/cdk": "^9.0.1",
"@angular/common": "~9.1.13",
"@angular/compiler": "~9.1.13",
"@angular/core": "~9.1.13",
"@angular/forms": "~9.1.13",
"@angular/material": "^9.0.1",
"@angular/platform-browser": "~9.1.13",
"@angular/platform-browser-dynamic": "~9.1.13",
"@angular/router": "~9.1.13",
"@ng-bootstrap/ng-bootstrap": "^5.1.1",
"@ngrx/effects": "^8.1.0",
"@ngrx/schematics": "^8.1.0",
"@ngrx/store": "^8.1.0",
"@ngrx/store-devtools": "^8.1.0",
"@ngx-translate/core": "^11.0.1",
"@ngx-translate/http-loader": "^4.0.0",
"npm": "^6.12.0",
"resize-observer-polyfill": "^1.5.1",
"rxjs": "^6.6.7",
"tslib": "^1.10.0",
"webpack": "^4.46.0",
"webpack-dev-server": "^3.11.3",
"zone.js": "~0.10.2"
 },

"devDependencies":{
"@angular-devkit/build-angular": "~0.901.15",
"@angular/cli": "~9.1.15",
"@angular/compiler-cli": "~9.1.13",
"@angular/language-service": "~9.1.13",
"@types/hammerjs": "^2.0.36",
"@types/jasmine": "~2.8.8",
"@types/jasminewd2": "~2.0.3",
"@types/node": "^12.11.1",
"codelyzer": "^5.1.2",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^2.0.6",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-spec-reporter": "^0.0.32",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "3.8.3"
 }

Nothing what I've found in internet && stackoverflow did not bring any solution aparat from disabling Ivy which I want to avoid.

What else should I do to make this work?

1 Answers

Have you already made sure that your are not importing any of the components in the declarations array in another module?

Related