How to upgrade Angular CLI to the latest version 12 .?

As a frontend developer, I’m using the ubuntu system to run Angular CLI. Angular is a robust and amazing framework. We can expect a major Angular version release every 6 months and 1-3 minor releases for each major release. To run Angular we have to set up an environment to run Angular in our system, we need Angular CLI and nodejs. To get the latest update, we need to update our Angular CLI and node version of a stable release.

In this tutorial, we will learn three thing, first how to upgrade Angular CLI to latest version, secondly on how to update our existing project, and at last how to downgrade Angular CLI.

How to upgrade Angular CLI from 11 to latest release 12

If you haven’t set up and installed Angular CLI, we have articles, on how to install Angular CLI and remove npm permission in the Ubuntu system. Currently Angular had released the latest version 12. To check the Angular CLI version run the following command, it will show you the Angular version.

ng --version

I had already updated to the latest Angular version 12 from version 11. As Angular depends on Nodejs, we also need the latest, stable nodejs version like 14.

Note: Before updating your project, if you are working in the corporate world, you need permission and plan carefully to upgrade your project to the latest Angular version. As Angular is dependent on so many other libraries, sometimes upgrades may not work smoothly. It may consume a lot of time and costs.

In order to update the angular-CLI package that installed globally in your system, you need to run:

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

ng update @angular/cli @angular/core

Depending on your system you may need to add sudo, to run npm permission, if you haven’t removed npm permission. It recommends that we always update to the latest patch version, as it contains fixes we released since the initial major release. To install the latest version with the version number by the following command.

ng update @angular/cli@^12 @angular/core@^12

Once installed, you can confirm if it was successful by running the following command:

ng --version

When updating the existing Angular project, we might also have to update other libraries like Angular material, rxjs, and others.

Once we have updated our global Angular CLI to the latest version. We are most likely to upgrade our local project version with the latest version:

rm -rf node_modules
npm uninstall --save-dev @angular/cli
npm install --save-dev @angular/cli@latest
npm install

How to downgrade Angular CLI

Sometimes, we may want to downgrade to a lower Angular CLI Version. To demonstrate it, to downgrade from version 12 to 11, we need to run the following command in npm.

npm uninstall -g @angular/cli
npm cache clean
npm install -g @angular/cli@11.x.x

If you want to learn more, about Angular updates, then please check the Angular official document on how to update to the latest version.

Related posts

• How to pass data in the angular route component?
• Sharing data between Angular Components?
• Angular Component LifeCycle.
• How to implement CKEditor in Angular
• How to use to implement HighCharts Angular