Search code examples
angularangular-cli

Angular CLI not compatible with Angular version


I'm upgrading my application from Angular v13 to v14 and I'm running into an error while running ng serve.

This version of CLI is only compatible with Angular versions ^13.0.0 || ^13.3.0-rc.0,
but Angular version 14.3.0 was found instead.

When searching online, I've found several people with the same issue as me.
One solved it by updating their custom-webpack package, but I'm not using that.
The other is about the wrong @angular/cli version being installed. But that one is correct for me as well. Sort of.

Globally I've installed @angular/cli@14.2.12, and in the project's package.json I have version ~14.2.12. It's slightly behind the angular version I'm upgrading to: 14.3.0 but there does not seem to be a 14.3.0 version of the @angular/cli.

I tried downgrading the update of Angular to version 14.2.12 instead of 14.3.0, but the issue persists. I also tried updating further to version 15.x.x where both the angular and the angular/cli version are the same, but still it shows the error about version 13.0.0.

Clearing npm cache or cloning the repo all over again didn't solve my problem either. I'm looking for other suggestions.

This is the complete list of dependencies I have in my package.json.

"devDependencies": {
    "@angular-devkit/architect": "^0.1502.1",
    "@angular-devkit/build-angular": "^14.2.12",
    "@angular-eslint/builder": "^13.5.0",
    "@angular-eslint/eslint-plugin": "^13.5.0",
    "@angular-eslint/eslint-plugin-template": "^13.5.0",
    "@angular-eslint/schematics": "^13.5.0",
    "@angular-eslint/template-parser": "^13.5.0",
    "@angular/cli": "~14.2.12",
    "@angular/compiler-cli": "^14.3.0",
    "@angular/language-service": "^14.3.0",
    "@babel/core": "^7.22.11",
    "@compodoc/compodoc": "^1.1.19",
    "@maxxton/build-tools": "^344.0.0",
    "@types/jest": "^29.5.4",
    "@types/leaflet": "^1.9.4",
    "@types/leaflet-draw": "^1.0.8",
    "@types/lodash": "4.14.45",
    "@typescript-eslint/eslint-plugin": "^5.54.1",
    "@typescript-eslint/parser": "^5.54.1",
    "babel-loader": "^8.2.5",
    "eslint": "^8.48.0",
    "jest": "^29.6.4",
    "jest-preset-angular": "^13.0.0",
    "ts-node": "^10.9.1",
    "typescript": "^4.9.5"
  },
  "dependencies": {
    "@agm/core": "^1.1.0",
    "@angular/animations": "14.3.0",
    "@angular/cdk": "^12.2.13",
    "@angular/common": "14.3.0",
    "@angular/compiler": "14.3.0",
    "@angular/core": "14.3.0",
    "@angular/forms": "14.3.0",
    "@angular/localize": "^14.3.0",
    "@angular/platform-browser": "14.3.0",
    "@angular/platform-browser-dynamic": "14.3.0",
    "@angular/platform-server": "^14.3.0",
    "@angular/router": "14.3.0",
    "@maxxton/core": "^8863.0.0",
    "@swimlane/ngx-charts": "^19.1.0",
    "core-js": "^3.32.1",
    "d3": "^7.1.1",
    "expr-eval": "^2.0.2",
    "firebase": "9.16.0",
    "install": "^0.13.0",
    "intl": "^1.2.5",
    "jest-environment-jsdom": "^29.6.4",
    "jszip": "^3.6.0",
    "jwt-decode": "^3.1.2",
    "keycloak-angular": "^11.0.0",
    "keycloak-js": "^16.1.0",
    "leaflet": "1.6",
    "leaflet-draw": "^1.0.4",
    "lodash": "4.17.4",
    "mixpanel-browser": "^2.47.0",
    "moment": "^2.17.1",
    "moment-timezone": "^0.5.21",
    "ngx-build-plus": "^13.0.1",
    "npm": "^9.8.1",
    "rison": "^0.1.1",
    "rxjs": "^6.6.7",
    "tinymce": "^6.7.0",
    "tslib": "^2.6.2",
    "xlsx": "^0.15.6",
    "zone.js": "~0.11.4"
  }

Solution

  • I was able to solve this by upgrading ngx-build-plus to version 14