How to Update Angular CLI to Latest Version

3
77
How To Upgrade Angular CLI To Version 7

In this article, we will upgrade from Angular to its latest version. Almost every 6-12 months, a new version of Angular is released. So to be up to date with the latest version is must needed step. You can find more about Angular CLI in its official documentation.

How to Update Angular CLI to Latest Version

You can check your current version of Angular CLI using the following command.

ng --version

To update angular-cli to its latest version, use the following commands.

sudo npm uninstall -g angular-cli // For Mac

npm uninstall -g angular-cli // For Windows Open Powershell on Administrator Mode

It will uninstall the angular-cli package globally from your computer or server.

Then we need to clear the cache using the following command.

sudo npm cache verify

If your npm version is < 5, you must hit the following command.

npm cache clean

Now, install the Angular CLI using the following command.

sudo npm install -g @angular/cli@latest

If your version is still old, then try the following command.

ng update @angular/cli

Now, check your Angular CLI version using the following command.

ng --version

How To Update Angular CLI To Version 7

After updating both the global and local packages, clear the cache to avoid errors:

npm cache verify (recommended)
npm cache clean (for older npm versions)

Update Angular Packages

Now you need to update the core packages/dependencies to Angular 7. Just run the following command:

ng update @angular/core

Upgrading RxJS

You can update RxJS using the ng update command:

ng update rxjs

Generating and serving an Angular project via a development server. Create and run a new project:

ng new my-project
cd my-project
ng serve

You can see the updated Angular CLI version 7 by creating the new Angular project.

Angular 7 CLI Example Tutorial

Now, when creating a new project, we got the following options, which are new in Angular 7.

When creating the Angular 7 project, we allowed the creation of the routing module. So it has the route file in the project folder.

Angular 7 Tutorial with Angular CLI

That’s it.

3 Comments

  1. I tried to follow these steps, but got:

    npm WARN @ng-bootstrap/ng-bootstrap@3.3.0 requires a peer of @angular/common@^6.1.0 but none is installed. You must install peer dependencies yourself.
    npm WARN @ng-bootstrap/ng-bootstrap@3.3.0 requires a peer of @angular/core@^6.1.0 but none is installed. You must install peer dependencies yourself.
    npm WARN @ng-bootstrap/ng-bootstrap@3.3.0 requires a peer of @angular/forms@^6.1.0 but none is installed. You must install peer dependencies yourself.
    npm WARN @ngtools/webpack@6.2.4 requires a peer of typescript@~2.4.0 || ~2.5.0 || ~2.6.0 || ~2.7.0 || ~2.8.0 || ~2.9.0 but none is installed. You must install peer dependencies yourself.
    npm WARN codelyzer@4.3.0 requires a peer of @angular/compiler@>=2.3.1 6.0.0-beta =2.3.1 6.0.0-beta ng update @ng-bootstrap/ng-bootstrap
    Package “@ng-bootstrap/ng-bootstrap” has an incompatible peer dependency to “@angular/common” (requires “^6.1.0”, would install “7.0.0”)
    Incompatible peer dependencies found. See above.

    • Jim just do a npm install @ng-bootstrap/ng-bootstrap@latest, this commands installs the latest version of ng-bootstrap which will be compatible with Angular 7

  2. I followed all the steps mentioned above, but i am still getting error as ng is not recognized as an internal command. What could be the reason and how can i resolve this?

Leave A Reply

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.