AppDividend
Latest Code Tutorials

Angular CLI update: How to upgade Angular CLI

Almost every 6-12 months, a new version of Angular is released. So to be up to date with the latest version. You can find more about Angular CLI on its official documentation. In addition, you can see the features and upgrades of Angular.

You can perform a necessary update to the current stable release of the core framework and CLI by running ng update @angular/cli @angular/core. To update to the next beta or pre-release version, use the –next=true option.

We recommend that you always update to the latest patch version, as it contains fixes we released since the initial major release. For example, use the following command to take the most recent 13.x.x version and update it. ng update @angular/cli@^13 @angular/core@^13.

Update Angular CLI

To update from one major version to another, use the format ng update @angular/cli@^<major_version> @angular/core@^<major_version>.

Upgrading Angular CLI to the next version required some steps. To update Angular CLI to a new version, you must update both the global package and your project’s local package dependencies.

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

ng --version

And you will get the next version.

 

Right now, I have version 13. So, the next step is to upgrade the version of Angular CLI 12 to Angular CLI 13.

To update the latest angular-cli package installed globally in your system, you need to run the following commands.

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

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

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

sudo npm cache verify

Angular CLI update

Then you need to hit the following command.

sudo npm cache clean

 

Now, install the Angular CLI using the following command.

sudo npm install -g @angular/cli@latest

 

It will install the updated angular cli version.

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

 

After updating both the global and local package, clear the cache to avoid errors.

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

Update Angular Packages

If you have created an Angular project, then go inside that folder and type 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 angulardemo
cd angulardemo
ng serve
If you are facing any npm install: Unhandled rejection Error: EACCES: permission denied error, then please try the following command.
sudo chown -R $USER:$GROUP ~/.npm
sudo chown -R $USER:$GROUP ~/.config

Now, you can see the newly installed Angular project.

 

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

When creating a new project, we got the following options, which are unique in Angular 13.

When creating the Angular 13 project, we have not allowed to create the routing module. Instead, see the following project structure.

Angular 8 Project Structure

That is it for upgrading the guide to Angular CLI.

Related Posts

Angular Tutorial

Angular Forms

Angular HttpClient

Angular File Upload 

Angular Routing

5 Comments
  1. Ankit Kanaujia says

    Thanks I have been searching for this for a while. If you can add angular universal tutorial for angular 8 that will be benificial.

  2. navil says

    this is great, thankyou!

  3. Fotso Teketchuet Stéphane says

    Hi. It didn’t work for me. I had to resort to delete the global node_modules folder ($HOME/.node_modules) and install angular CLI from scratch.

  4. sarfaraz says

    ********* Steps to update your Angular CLI ********** :-

    1. Open PowerShell in Admin Mode
    2. type – npm uninstall -g angular-cli
    3. type – npm cache verify
    4. type – npm cache clean –force
    5. type – npm install -g @angular/cli@latest

    **FOR Existing Project :

    Now go to visual studio code, open any project and type below commands :-

    1. npm install –save-dev @angular/cli@latest
    2. ng update @angular/cli
    3. ng update @angular/core
    4. ng update rxjs

  5. Fahim says

    Thanks a bunch! Was really helpful!

Leave A Reply

Your email address will not be published.

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