VVersions.dev

Angular 16 → Angular 18

Angular 16 is end-of-life, so move to 18 promptly. The official ng update CLI handles most mechanical work one major at a time (16→17→18), bringing standalone components by default, the new built-in control flow, stabilizing signals, and the esbuild/Vite dev server.

Version upgradeDifficulty: moderateEffort: 0.5–3 days for a typical appmedium risk

Last verified · Updated May 22, 2026

Angular 16 is end-of-life, so upgrade to 18 promptly. Angular does not support skipping majors, so go 16 → 17 → 18, running ng update once per major. The CLI handles most mechanical changes; the notable new defaults are standalone components, the @if/@for/@switch control flow, and stabilized signals.

Upgrade one major at a time

Angular's policy is to upgrade a single major version at a time. Run ng update for 16 → 17 first, verify, then 17 → 18. Each ng update applies the schematics for that step, so jumping directly skips migrations the CLI would otherwise run.

What changed across 16 → 18

  • Standalone components are the CLI default (17+); bootstrapApplication replaces the root NgModule.
  • New built-in control flow: @if / @for / @switch, with a schematic to migrate *ngIf / *ngFor.
  • Signals moved from developer preview toward stable for reactive state.
  • esbuild + Vite power the application builder and dev server for faster builds.
  • Improved SSR with full hydration (provideClientHydration).

ng update drives the version bumps

# Upgrade one major at a time — never skip
ng update @angular/core@17 @angular/cli@17
# verify, commit, then:
ng update @angular/core@18 @angular/cli@18

# Optional: adopt the new control flow and standalone APIs
ng generate @angular/core:control-flow
ng generate @angular/core:standalone

Angular 16 vs 18

ConcernAngular 16Angular 18
Component modelNgModules by defaultStandalone by default
Template control flow*ngIf / *ngFor@if / @for / @switch
Reactive stateRxJS / @InputSignals (stable)
Builderwebpackesbuild + Vite
SSRPartialFull hydration

ℹ Let ng update do the mechanical work

Modern Angular's ng update runs schematics that rewrite most affected code for each major. Run it per major, review the diff, and only hand-edit what the CLI flags.

AI-assisted upgrade workflow

Upgrade this app from Angular 16 to 18 one major at a time. For each step run `ng update @angular/core@<next> @angular/cli@<next>`, review the schematic changes, fix any flagged code, then run ng build, ng lint, and ng test before continuing. After reaching 18, optionally run the control-flow and standalone schematics. Report results after each major and never skip a version.

Safety: Run ng update one major at a time. Commit and verify after each major before proceeding; do not adopt the control-flow/standalone schematics in the same commit as a version bump.

PR review checklist

  • @angular/core and @angular/cli are on the same 18.x version
  • ng update was run per major (16→17, then 17→18), not skipped
  • Schematic-applied changes were reviewed, not blindly accepted
  • Third-party Angular libraries resolve to Angular 18-compatible versions
  • ng build and ng test pass with no new warnings

Rollback strategy

  • Keep each ng update major in its own commit so a single major can be reverted.
  • Restore package.json and the lockfile and reinstall to revert a bump.
  • Hold the upgrade behind a release branch until the full test suite is green.

Official sources

Copy-ready AI prompts

Structured prompts for an AI coding assistant. Inspect first, then execute incrementally, and keep a human in the review loop.

Repo inspection: Repo inspection prompt

You are helping migrate an Angular codebase from Angular 16 to Angular 18.

Do not edit files yet. First inspect the repository and report:
1. The exact @angular/core and @angular/cli versions in package.json and the lockfile (or the angular.js version for AngularJS apps).
2. The architecture: NgModules vs standalone components, the router in use ($routeProvider, ui-router, or @angular/router), and any $scope/controller code still present.
3. Components, services, and directives grouped by complexity so a migration order can be planned.
4. Third-party libraries and whether they have versions compatible with the target.
5. Build, lint, and test commands (ng build, ng test, ng lint, or the legacy toolchain).

Return: a migration risk summary, the modules/components most likely to break, a suggested incremental order, the commands to run before editing, and any questions that need human confirmation.

Safety: Inspection only. The agent must not modify files in this step.

Works with Claude Code, Cursor, GitHub Copilot.

Migration execution: Migration execution prompt

Migrate this codebase from Angular 16 to Angular 18, one component or concern at a time.

Work incrementally and pause for review after each unit: stand up the hybrid/bridge layer first, then migrate the lowest-risk leaf component, rewrite its template and state, wire it back into the host app, and verify it renders identically before moving on. Convert services and routing only after the components that depend on them are migrated.

After each step run the project's build, lint, and tests, and report results before continuing. Do not refactor unrelated code or bundle multiple components into one change.

Safety: Apply changes incrementally and keep each step reviewable. Never bundle unrelated refactors or migrate multiple components at once.

Works with Claude Code, Cursor, GitHub Copilot.

Test plan

Commands

  • ng build
  • ng lint
  • ng test --watch=false
  • npx playwright test

Manual checks

  • Render key views and confirm no template errors after the control-flow migration.
  • SSR: load server-rendered pages and confirm hydration completes with no console warnings.
  • Verify third-party Angular libraries load on Angular 18.

Regression risks

  • Skipping a major and missing the schematics ng update would have applied.
  • Third-party libraries not yet compatible with Angular 18.
  • Hydration mismatches after enabling full SSR hydration.

Acceptance criteria

  • @angular/core and @angular/cli are on Angular 18 with matching versions.
  • ng build, lint, unit, and e2e tests pass.
  • No new Angular compiler or hydration warnings.

Frequently asked questions

Can I jump straight from Angular 16 to 18?

No. Angular supports upgrading one major at a time. Run ng update for 16 → 17 first, verify, then 17 → 18. Each step runs the schematics for that major, so skipping a version skips migrations the CLI would otherwise apply.

Do I have to adopt standalone components and the new control flow?

Not immediately. NgModules and *ngIf/*ngFor still work in Angular 18. Standalone is only the CLI default for new code, and the @angular/core:standalone and :control-flow schematics let you migrate existing code incrementally when you choose.