Angular: Upgrading to version 5 error: Version of @angular/compiler-cli needs to be 2.3.1 or greater. Current version is "5.0.0"

Question

Disclaimer

Potential duplicate of this, however the question in detail does not show the specific error message in question, thus it is ambiguous and unhelpful. I was not able to find that at all when putting in my error in Google, and that's cause his question doesn't contain the error anywhere.

Please do not close this question unless the other question is edited for clarity, as there are no other results for the error in question.

---

Trying to run ng serve after upgrading to v5, but getting some errors. Anyone know what's up? My @angular/compiler-cli is 5.0.0 according to package.json...not sure why it's saying 5.0.0 is less than 2.3.1.

This was my upgrade command:

npm install @angular/{animations,common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router}@5.0.0

I received the following error:

$ ng serve
Your global Angular CLI version (1.5.0) is greater than your local
version (1.0.0). The local Angular CLI version is used.

To disable this warning use "ng set --global warnings.versionMismatch=false".
Version of @angular/compiler-cli needs to be 2.3.1 or greater. Current version is "5.0.0".
Error: Version of @angular/compiler-cli needs to be 2.3.1 or greater. Current version is "5.0.0".
    at Object.<anonymous> (REDACTED/node_modules/@ngtools/webpack/src/index.js:27:11)
    at Module._compile (module.js:624:30)
    at Object.Module._extensions..js (module.js:635:10)
    at Module.load (module.js:545:32)
    at tryModuleLoad (module.js:508:12)
    at Function.Module._load (module.js:500:3)
    at Module.require (module.js:568:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (REDACTED/node_modules/@angular/cli/tasks/eject.js:10:19)
    at Module._compile (module.js:624:30)
    at Object.Module._extensions..js (module.js:635:10)
    at Module.load (module.js:545:32)
    at tryModuleLoad (module.js:508:12)
    at Function.Module._load (module.js:500:3)
    at Module.require (module.js:568:17)
    at require (internal/module.js:11:18)

Here is package.json:

{
    "name": "App",
    "version": "0.0.0",
    "license": "MIT",
    "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "start-hmr": "ng serve --hmr -e=hmr",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e"
    },
    "private": true,
    "dependencies": {
        "@angular/animations": "^5.0.0",
        "@angular/common": "^5.0.0",
        "@angular/compiler": "^5.0.0",
        "@angular/core": "^5.0.0",
        "@angular/forms": "^5.0.0",
        "@angular/http": "^5.0.0",
        "@angular/platform-browser": "^5.0.0",
        "@angular/platform-browser-dynamic": "^5.0.0",
        "@angular/platform-server": "^5.0.0",
        "@angular/router": "^5.0.0",
        "@angularclass/hmr": "^1.2.2",
        "@types/jquery": "^2.0.48",
        "@types/lodash": "^4.14.73",
        "angular2-moment": "^1.7.0",
        "bootstrap": "^3.3.7",
        "core-js": "^2.5.0",
        "jquery": "^3.2.1",
        "lodash": "^4.17.4",
        "particles.js": "^2.0.0",
        "rxjs": "^5.5.2",
        "zone.js": "^0.8.16"
    },
    "devDependencies": {
        "@angular/cli": "1.0.0",
        "@angular/compiler-cli": "5.0.0",
        "@types/jasmine": "2.5.38",
        "@types/node": "^6.0.87",
        "codelyzer": "~2.0.0",
        "jasmine-core": "~2.5.2",
        "jasmine-spec-reporter": "~3.2.0",
        "karma": "~1.4.1",
        "karma-chrome-launcher": "~2.0.0",
        "karma-cli": "~1.0.1",
        "karma-coverage-istanbul-reporter": "^0.2.0",
        "karma-jasmine": "~1.1.0",
        "karma-jasmine-html-reporter": "^0.2.2",
        "protractor": "~5.1.0",
        "ts-node": "~2.0.0",
        "tslint": "~4.5.0",
        "typescript": "~2.4.2"
    }
}

Answer 1

In this situation, you need to update the local install of the @angular/cli from 1.0.0 to 1.5.0. That many minor versions with the CLI includes a lot of changes, along with the changes in dependencies that come along with those updates.

To update the local version of your CLI to the latest version, use the following command from a command prompt/terminal open to the root directory of the project.

npm install --save-dev @angular/cli@latest

Or, you can just update the version in the package.json, and run npm install.

You could hide the warning the CLI shows when the global and local CLI versions are out of sync, but that could hide a solution to any issues you are having. To hide the warning run this command:

ng set --global warnings.versionMismatch=false

Best to keep this local and global versions in sync to avoid issues.