
September 24, 2026 11:48 by
Peter
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.