Upgrading a real Angular application from v19 to v22 may seem intimidating, but Angular's built-in migration tools make the process smooth and predictable. The recommended approach is to upgrade one major version at a time so that migrations are applied safely.

This guide explains:

  • Exact commands to run
  • What the Angular CLI output means
  • Validation steps after each upgrade
  • Best practices to avoid common issues

Upgrade Path: Angular 19 → 22
Angular major versions should be upgraded sequentially:

19 → 20 → 21 → 22

Each upgrade uses:
ng update @angular/core@<version> @angular/cli@<version>

Step 1: Upgrade Angular 19 → 20

1. Check Available Updates
Run:
ng update

Meaning
Angular CLI will:

  • Read versions from package.json
  • Compare them with available versions
  • Recommend update commands
  • Show packages requiring migration

2. CLI Output Example
You may see something similar to:
@angular-eslint/schematics 19.2.0 -> 20.x.x
@angular/cdk 19.2.0 -> 20.x.x
@angular/cli 19.2.0 -> 20.x.x
@angular/core 19.2.0 -> 20.x.x


Meaning

  • Left side = your current version
  • Right side = recommended target version
  • Angular suggests migration commands

Update Commands
Update Angular Core & CLI
ng update @angular/cli@20 @angular/core@20

Update Angular CDK

If using Angular Material:
ng update @angular/cdk@20

Update Angular ESLint
ng update @angular-eslint/schematics

Validate the Application

Run:
ng serve

ng test

ng build --configuration production

Fix any compilation or test issues.

Commit your code:
git add .
git commit -m "Angular 19 to 20 upgrade"


Step 2: Upgrade Angular 20 → 21
1. Check Updates

Run:
ng update

2. CLI Output Example
You may see something similar to:
@angular-eslint/schematics 20.x.x -> 21.x.x
@angular/cdk 20.x.x -> 21.x.x
@angular/cli 20.x.x -> 21.x.x
@angular/core 20.x.x -> 21.x.x


Update Commands
Update Angular Core & CLI

ng update @angular/cli@21 @angular/core@21

Update Angular CDK
ng update @angular/cdk@21

Update Angular ESLint
ng update @angular-eslint/schematics

Validate the Application
Run:
ng serve

ng test

ng build --configuration production

Fix any compilation or test issues.

Commit your code:
git add .
git commit -m "Angular 20 to 21 upgrade"


Step 3: Upgrade Angular 21 → 22
1. Check Updates

Run:
ng update

2. CLI Output Example
You may see something similar to:
@angular-eslint/schematics 21.x.x -> 22.x.x
@angular/cdk 21.x.x -> 22.x.x
@angular/cli 21.x.x -> 22.x.x
@angular/core 21.x.x -> 22.x.x

Update Commands
Update Angular Core & CLI

ng update @angular/cli@22 @angular/core@22

Update Angular CDK
ng update @angular/cdk@22

Update Angular ESLint

ng update @angular-eslint/schematics

Validate the Application
Run:
ng serve

ng test

ng build --configuration production


Fix any compilation or test issues.
Commit your code:
git add .
git commit -m "Angular 21 to 22 upgrade"


Post-Upgrade Verification
Verify project versions:
ng version

Expected output:
Angular CLI: 22.x.x
Angular: 22.x.x
TypeScript: Compatible Version
Node: Supported Version

Common Issues and Fixes
Dependency Conflicts

Check outdated packages:
npm outdated

Update remaining dependencies:
npm update

Clean Install
If packages become inconsistent:
rm -rf node_modules
rm package-lock.json


Then run:
npm install

Angular Material Issues
If you're using Angular Material:
ng update @angular/material

or:
ng update @angular/cdk

Final Upgrade Checklist

Step

Status

Upgrade 19 → 20

Run Build & Tests

Upgrade 20 → 21

Run Build & Tests

Upgrade 21 → 22

Run Build & Tests

Verify ng version

Deploy to Test Environment

Best Practice

Always commit your code after every major version upgrade:
19 → 20 → Commit
20 → 21 → Commit
21 → 22 → Commit


This makes troubleshooting much easier and allows quick rollback if any migration introduces issues.

Summary
Instead of trying to leap straight to version 22, Angular should be upgraded from version 19 to version 22 in a gradual manner through versions 20 and 21. An organized method for handling the migration is to use ng update, validate the application following each migration, run tests and production builds, and commit the changes following each significant upgrade. Common upgrade problems may be found and fixed by checking dependencies, doing a clean installation where needed, and confirming the final Angular, TypeScript, and Node versions.