Angular Upgrade Planner

Commit or stash all work, then make sure you are on the latest minor/patch of your current major before running ng update. Upgrade exactly one major at a time and run the app/tests after each hop.

Angular 17 requires Node.js 18.13+ or 20.9+ and TypeScript 5.2 up to 5.4.

Update the core framework and CLI together. This applies the official automatic migration schematics for this version.

ng update @angular/core@17 @angular/cli@17

New applications use the esbuild + Vite application builder (@angular-devkit/build-angular:application) with faster builds and a Vite dev server. Existing apps keep the webpack builder until migrated. SSR moves to the new @angular/ssr package and is offered during ng new.

New built-in control flow replaces *ngIf/*ngFor/*ngSwitch — run ng generate @angular/core:control-flow to migrate templates. Deferrable views (@defer) enable lazy loading of template blocks.

ng generate @angular/core:control-flow

signal() and computed() are stable (effect() stays in developer preview until v20), afterRender/afterNextRender hooks are added in developer preview, and the View Transitions API is supported via withViewTransitions.

Commit or stash all work, then make sure you are on the latest minor/patch of your current major before running ng update. Upgrade exactly one major at a time and run the app/tests after each hop.

Angular 18 requires Node.js 18.19.1+, 20.11.1+, or 22, and TypeScript 5.4 or 5.5.

Update the core framework and CLI together. This applies the official automatic migration schematics for this version.

ng update @angular/core@18 @angular/cli@18

provideExperimentalZonelessChangeDetection lets you trial zoneless apps, and event replay for SSR is available in preview. Review zone-dependent code before trying zoneless.

Angular Material 3 is stable, the build tooling is published as @angular/build, deferrable views and built-in control flow are stable, ng-content supports default/fallback content, and route redirects can be functions.

Commit or stash all work, then make sure you are on the latest minor/patch of your current major before running ng update. Upgrade exactly one major at a time and run the app/tests after each hop.

Angular 19 requires Node.js 18.19.1+, 20.11.1+, or 22, and TypeScript 5.5 up to 5.8.

Update the core framework and CLI together. This applies the official automatic migration schematics for this version.

ng update @angular/core@19 @angular/cli@19

Components, directives, and pipes are standalone by default; NgModule-based declarations must set standalone: false. Run the standalone migration, and optionally enable strictStandalone.

Incremental hydration (preview), route-level render mode (SSR/SSG/CSR), the experimental resource() API, linkedSignal, @let template variables, and HMR for styles are introduced.

Commit or stash all work, then make sure you are on the latest minor/patch of your current major before running ng update. Upgrade exactly one major at a time and run the app/tests after each hop.

Angular 20 requires Node.js 20.19+, 22.12+, or 24, and TypeScript 5.8 (up to <6.0). Node 18 and TypeScript 5.7 and below are no longer supported.

Update the core framework and CLI together. This applies the official automatic migration schematics for this version.

ng update @angular/core@20 @angular/cli@20

The DOCUMENT token moved from @angular/common to @angular/core. The ng update migration rewrites the imports automatically.

The structural directives are deprecated in favor of built-in control flow (@if/@for/@switch). They still ship in Angular 22, marked for removal in a future major. Run the control-flow migration. TestBed.get() is removed (auto-migrated to TestBed.inject()), and TestBed.flushEffects() is deprecated in favor of TestBed.tick().

ng generate @angular/core:control-flow

The compiler can now type-check host bindings and @HostBinding/@HostListener expressions. It is opt-in in v20 via typeCheckHostBindings in angularCompilerOptions, and becomes the default in v21, so enabling it now surfaces errors early.

effect(), linkedSignal() and toSignal() are now stable, completing the core signal APIs. Zoneless change detection moves to developer preview and provideExperimentalZonelessChangeDetection is renamed provideZonelessChangeDetection.