How to upgrade Angular version to latest release (version 10)

Angular is infamous for frequent version releases. Angular team try to deliver at least two major versions in a year.

You can find Angular release schedule here:

In general, you can expect the following release cycle:

A major release every 6 months

1–3 minor releases for each major release

A patch release and pre-release (next or rc) build almost every week

If you are a web developer working with Angular since its version 2, then you must have suffered from the pain of version upgrade. Thanks to Angular team, the version upgrade is smooth now (or is it?) if you keep upgrading your Angular project on regular basis. In this story, I will share few important links, and tips how to keep project up-to-date.

Upgrade Angular CLI globally

First, check your current Angular CLI version by running command. Note that if you run this command inside Angular project directory then you will get Angular project’s version. If you run it outside Angular version then you will get global Angular CLI version.

ng version

The Angular CLI is installed on global level as well as on project level. If you upgrade Angular CLI version inside Angular project then it shall update only project’s Angular CLI version. The global Angular CLI version can be upgraded by removing previous version and installing newer one.

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

Once Angular CLI has been upgraded globally, you can create new Angular project by running command:

ng new <project_name>

Upgrade Angular version using command

The Angular CLI can upgrade your older project’s Angular version to latest by running command:

ng update @angular/cli @angular/core

Make sure the project folder as node_modules folder otherwise this command will throw an error. You can read more about ng update command at Angular official website.

Upgrade Angular version semi-automatically

The ng update command is not a silver bullet. The complex Angular project might have many 3rd party libraries, packages installed which couldn’t be upgraded safely to newer version. In such scenario, upgrading to newer version needs extra efforts.

The Angular update website provides a simple web interface where you can select your project attributes like from which Angular version to target Angular version, project complexity etc. The website then, shall provide step by step guide how to update your project for newer version.

Angular official websites provides Release Information for each new release with steps to migrate. You can find steps for upgrading to version 10 at below website:

Experimental releases

You can keep an eye on upcoming Angular version and feature with next version tag.

You can also set flag next in Angular CLI update command while version upgrade.

ng update @angular/cli @angular/core --next=true

Stay informed

You can keep eye on Angular twitter handle and Medium blog.

When should I upgrade?

In corporate world, not every team has liberty to keep upgrading their project version to latest Angular version. First, it costs money! You have to put a task in your backlog/sprint for upgrade. Second, it’s hard to convince management, why would you like to keep it up-to-date when everything seems to work with current version? I have seen teams who keeps their project up-to-date to each major release, whereas some choose to go for upgrade after each alternate major release (e.g. from version 7 to 9 skipping version 8). Some teams choose to upgrade only if the new release has some breaking changes with respect to their project features. They are not interested in new features but want to make sure that existing features and functionalities won’t be affected by new version.

Ideally if you keep upgrading your Angular version for each major release then you will enjoy smooth transition as compared to staggered release upgrade.

Cheers!

Cloud Solution Architect | Author | Full Stack Developer | https://www.linkedin.com/in/balram-chavan | https://www.hiretheauthor.com/balramchavan