How to update Angular to latest version

The Angular Team release a new version of the Angular at regular intervals. To keep up with the latest version, we need to update or upgrade our Angular Application. Since Angular 6, upgrading or updating Angular applications has become much simpler.

Why is Updating Angular Important?

Angular is continuously evolving, with new features, performance improvements, security updates, and bug fixes in each release. Staying up to date ensures:

  • Better Performance – New versions often include optimizations for speed and efficiency.
  • Security Fixes – Updates address vulnerabilities, making applications more secure.
  • New Features – Each release brings enhancements and new APIs that improve development.
  • Long-term Support – Older versions eventually become unsupported, making upgrades necessary.

However, manually updating an Angular application can be complex and time-consuming, especially when handling dependencies, breaking changes, and migration steps.

How ng update Helps

Starting from Angular 6, the Angular CLI introduced the ng update command to automate much of the upgrade process. This tool:

  • Automatically updates dependencies to compatible versions.
  • Modifies configuration files like angular.json and tsconfig.json as needed.
  • Runs migration scripts to apply necessary code changes for breaking updates.
  • Detects deprecated APIs and suggests replacements.

With ng update, upgrading Angular is faster, safer, and less error-prone compared to manual updates.

ng update

The Angular CLI Command ng update. makes it easier to update the application and its dependencies

OPTIONAliasDefaultDESCRIPTION
--help=true|false| json| JSONfalseShows a help message for this command in the console.
--force=true|falsefalseIf true, forces the update even if the installed packages are incompatible with the update. if false, packages are not updated and the error message is shown
--next=true|falsefalseUse the largest version, including beta and RCs.
--migrateOnly=true|falsefalseOnly perform a migration, does not update the installed version.
--name=nameempty string
The name of the migration to run. Only available when a single package is updated
--from=fromVersion from which to migrate from. Only available with a single package being updated, and only on migration only.
--to=toVersion up to which to apply migrations. Only available with a single package being updated, and only on migrations only. Requires from to be specified. Default to the installed version detected.
--allow-dirty=true|falsefalseWhether to allow updating when the repository contains modified or untracked files
--verbose=true|falsefalseDisplay additional details about internal operations during execution.
--create-commits=true|falsefalseCreate source control commits for updates and migrations.
--all=true|false***Removed in newver versionfalseselecting true will update all packages in package.json.
--packageManager=npm|yarn***Removed in newver versionnpmThe preferred package manager configuration files to use for registry settings
--packages***Removed in newver versionThe names of package(s) to update
--registry=registry***Removed in newver versionThe NPM registry to use.

Find out what changed

Before upgrading, you need to know the features that have changed, new features added, and breaking changes introduced. Please take a look at the Angular Changelog for details.

Find out what needs to be changed

Once you know the list of changes, the next step is to find out what needs to be changed in your app so that you can safely upgrade to the next version. This you can find out from the Angular Update Guide

Once you open the above site, you need to follow these steps and the guide will list you the changes required

  • Choose the Current version Angular and the version you wish to upgrade
  • Select the App Complexity as Advanced
  • Choose other dependencies 
  • Choose your package manager
  • Click on Show me how to update

The Application tells you the steps needed to upgrade. 

The guide provides a structured list of changes required in three phases: Before Update, During the Update, and After Update.

Upgrading using ng update 

The steps mentioned above should be sufficient to upgrade the application. This section explains the upgrade process using ng update.

This section explains the steps involved in upgrading the Angular app using ng update 

  1. Update Node.js to the latest version.
  2. Install Angular CLI Globally & Locally
  3. Run ng update @angular/cli to update configuration files
  4. Update the Core Packages & Dependencies

Update Node.js to the latest version

Run the following command to update Node.js:

Install Angular CLI Globally & Locally

Install the latest Angular CLI version: 

Verify that Angular CLI is Installed correctly by inspecting the package.json file. The "@angular/cli": "^X.X.X" must be listed under the "devDependencies" node. If it appears under the "dependencies", or an older version still exists, remove it. If the version is not the latest, then you can change it and then run npm install to update it.

You can also install the older version of Angular CLI by appending the version no as shown below

If you are upgrading to an older version of Angular, for example, version 6, then it is better to install the corresponding Angular CLI Version

Since, the Angular Version 6, the Angular CLI follows the same Version No as the Angular. Hence for Angular 7, the corresponding version of the Angular CLI is 7. 

The Angular CLI version 1.7 was for Angular 5 and Angular CLI 1.4 was for Angular 4  

Run ng update to update configuration files

The next step is to update the various configuration files like angular.jsonkarma.conf.js etc. This is done by running the following command 

Update core packages & dependencies

The next step is to update the Angular Core packages & Dependencies. The following command updates the Angular core packages & rxjs.

The Following gives you the list of packages (not all) that needs to be updated along with the command.

You can force Angular to update all the dependencies by using --all & --force flag

And if you encounter an error after running the above steps, then you can remove the  node_modules folder & package-lock.json file and run npm install

Tips to upgrade

Update to the Latest Version Regularly

Angular releases major versions every six months, with minor updates and bug fixes more frequently. Updating once a month or two helps keep changes minimal and manageable.

Keep an Eye on Deprecated Features

Major Angular versions may introduce breaking changes and deprecate some APIs. Check the Angular Changelog regularly. Deprecated features are usually supported for at least two major versions, giving developers time to make necessary updates.

Leave a Comment

Your email address will not be published. Required fields are marked *

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

Scroll to Top