How to Downgrade AngularCli version

Question

I have updated my angular cli version and now it showing angular : 5.2.0

I have entire code build in angular4. Can you help me with the steps to downgrade my angularcli version (specific version) so that I have angular4. Here is my current configuration:

Angular CLI: 1.6.4
Node: 9.2.1
OS: win32 x64
Angular: 5.2.0
@angular/cli: 1.6.4
@angular-devkit/build-optimizer: 0.0.38
@angular-devkit/core: 0.0.25
@angular-devkit/schematics: 0.0.48
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.4
@schematics/angular: 0.1.13
@schematics/schematics: 0.0.13
typescript: 2.4.2
webpack: 3.10.0

Global

Angular CLI: 1.6.3
Node: 9.2.1
OS: win32 x64
Angular:
...

I tried below commands but no luck

npm uninstall -g angular-cli
npm cache clean
npm install -g [email protected]

package.json

    {
  "name": "crud-operation",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^4.0.0",
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.0.0",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/http": "^4.0.0",
    "@angular/platform-browser": "^4.0.0",
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/router": "^4.0.0",
    "core-js": "^2.4.1",
    "rxjs": "^5.5.6",
    "zone.js": "^0.8.19"
  },
  "devDependencies": {
    "@angular/cli": "1.6.4",
    "@angular/compiler-cli": "^4.0.0",
    "@angular/language-service": "^4.0.0",
    "@types/jasmine": "~2.8.3",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "^4.0.1",
    "jasmine-core": "~2.8.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~2.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~3.2.0",
    "tslint": "~5.9.1",
    "typescript": "~2.5.3"
  }
}

Solution 1

Go to you package.json and change all @angular dependencies to 4.0.0 or any version you want.  
Then do the same for @angular-cli with the version number you want it to be. just like the code below

- Save that file    
- Delete you node-modules folder  
- run `npm install` or `yarn` if you are using yarn. 




 {
    "name":"crud-operation",
     "version":"0.0.0",
     "license":"MIT",
     "scripts":{
     "ng":"ng",
          "start":"ng serve",
          "build":"ng build --prod",
          "test":"ng test",
          "lint":"ng lint",
          "e2e":"ng e2e"
       },
       "private":true,
       "dependencies":{
          "@angular/animations":"4.0.0",
          "@angular/common":"4.0.0",
          "@angular/compiler":"4.0.0",
          "@angular/core":"4.0.0",
          "@angular/forms":"4.0.0",
          "@angular/http":"4.0.0",
          "@angular/platform-browser":"4.0.0",
          "@angular/platform-browser-dynamic":"4.0.0",
          "@angular/router":"4.0.0",
          "core-js":"^2.4.1",
          "rxjs":"^5.5.6",
          "zone.js":"^0.8.19"
       },
       "devDependencies":{
          "@angular/cli":"1.6.3",
          "@angular/compiler-cli":"4.0.0",
          "@angular/language-service":"4.0.0",
          "@types/jasmine":"~2.8.3",
          "@types/jasminewd2":"~2.0.2",
          "@types/node":"~6.0.60",
          "codelyzer":"^4.0.1",
          "jasmine-core":"~2.8.0",
          "jasmine-spec-reporter":"~4.2.1",
          "karma":"~2.0.0",
          "karma-chrome-launcher":"~2.2.0",
          "karma-cli":"~1.0.1",
          "karma-coverage-istanbul-reporter":"^1.2.1",
          "karma-jasmine":"~1.1.0",
          "karma-jasmine-html-reporter":"^0.2.2",
          "protractor":"~5.1.2",
          "ts-node":"~3.2.0",
          "tslint":"~5.9.1",
          "typescript":"~2.5.3"
   }
}

Solution 2

Because the angular package name has changed:

npm uninstall -g @angular/cli
npm cache clean
npm install -g  @angular/cli@latest

Also please note that the @angular/cli version and then angular version are mutually exclusive.

If you want to downgrade the version of angular for your project only, then change the angular version in your package.json.

Comments

[Nadhir Falta]

@KunalVijan can I see your package.json ?

[Kunal Vijan]

I have added into the post

[Nadhir Falta]

What version of cli you wanna use ?

[Kunal Vijan]

I wanted to use 1.6.3 for cli and angular 4

[Kunal Vijan]

works like charm. thanks I can see angular 4 now. Angular CLI: 1.6.3 Node: 9.2.1 OS: win32 x64 Angular: 4.0.0 ... animations, common, compiler, compiler-cli, core, forms ... http, language-service, platform-browser ... platform-browser-dynamic, router, tsc-wrapped @angular/cli: 1.6.3 @angular-devkit/build-optimizer: 0.0.38 @angular-devkit/core: 0.0.25 @angular-devkit/schematics: 0.0.48 @ngtools/json-schema: 1.1.0 @schematics/angular: 0.1.13 @schematics/schematics: 0.0.13 typescript: 2.5.3 webpack: 3.10.0

[Nadhir Falta]

Cool!! You're welcome, the ^ sign tells npm to always get the latest version