angularupgradengx-translateangular15angular16

"This likely means that the library (@ngx-translate/core) which declares TranslateModule is not compatible with Angular Ivy" error in Angular app


I'm getting the following error when I run npm start in my angular app, after upgrading from Angular 15 to 16 following the steps in update.angular.io

This likely means that the library (@ngx-translate/core) which declares TranslateModule 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.

Besides that, I got the error

This import contains errors, which may affect components that depend on this NgModule about 2 modules of my app and also 'LoggerModule' does not appear to be an NgModule class.

An important thing to say is that this app was working perfectly with Angular 15 and got broken in the process of migrating to Angular 16.

Here is my package.json:

{
  "name": "client-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^16.2.12",
    "@angular/cdk": "^15.2.9",
    "@angular/common": "^16.2.12",
    "@angular/compiler": "^16.2.12",
    "@angular/core": "^16.2.12",
    "@angular/forms": "^16.2.12",
    "@angular/material": "^15.2.9",
    "@angular/material-moment-adapter": "^15.2.9",
    "@angular/platform-browser": "^16.2.12",
    "@angular/platform-browser-dynamic": "^16.2.12",
    "@angular/router": "^16.2.12",
    "@ngx-translate/core": "^13.0.0",
    "@ngx-translate/http-loader": "^6.0.0",
    "@types/file-saver": "^2.0.1",
    "ajv": "^6.12.6",
    "babel-polyfill": "^6.26.0",
    "classlist.js": "^1.1.20150312",
    "core-js": "^3.8.1",
    "file-saver": "^2.0.5",
    "jwt-decode": "^3.1.2",
    "material-design-icons": "^3.0.1",
    "moment": "^2.29.1",
    "ngx-logger": "^4.1.9",
    "rxjs": "~6.6.0",
    "rxjs-compat": "^6.6.3",
    "tslib": "^2.0.0",
    "web-animations-js": "^2.3.2",
    "zone.js": "~0.13.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^16.2.12",
    "@angular-devkit/schematics": "^16.2.12",
    "@angular/cli": "^16.2.12",
    "@angular/compiler-cli": "^16.2.12",
    "@angular/language-service": "^16.2.12",
    "@types/chai": "^4.2.14",
    "@types/cucumber": "^6.0.1",
    "@types/jasmine": "~3.6.0",
    "@types/jasminewd2": "^2.0.8",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "cucumber": "^6.0.7",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~6.4.2",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-coverage-istanbul-reporter": "^3.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "1.5.0",
    "mail-listener2": "^0.3.1",
    "oidc-client": "^1.10.1",
    "protractor": "~7.0.0",
    "protractor-cucumber-framework": "^6.2.1",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.9.5"
  }
}

I've tried with no success:


Solution

  • As the error says, updating the packages to a newer version was the trick. I just executed npm i @ngx-translate/core@15.0.0 and npm i ngx-logger@5.0.12 it worked. Thanks @Andrei