@openrewrite/recipes-angular 1.8.0-20260804-103913 → 1.8.0

package/src/migration/upgrade-to-angular-16.ts

@@ -6,7 +6,7 @@
 
 import {Recipe} from "@openrewrite/rewrite";
 import {ChangeImport, upgradeDependencyVersion} from "@openrewrite/rewrite/javascript";
-import {UpgradeToAngular15} from "./upgrade-to-angular-15";
+import {UpgradeToAngular15CodeChanges} from "./upgrade-to-angular-15";
 import {RemoveEntryComponents} from "./remove-entry-components";
 import {RemoveModuleId} from "./remove-module-id";
 import {ReplaceRouterLinkWithHref} from "./replace-router-link-with-href";
@@ -15,18 +15,15 @@ import {FindRenderModuleFactoryUsage} from "../search/find-render-module-factory
 import {FindBrowserTransferStateModuleUsage} from "../search/find-browser-transfer-state-module-usage";
 import {FindRenderApplicationUsage} from "../search/find-render-application-usage";
 
-export class UpgradeToAngular16 extends Recipe {
-    readonly name = "org.openrewrite.angular.UpgradeToAngular16";
-    readonly displayName = "Upgrade to Angular 16";
-    readonly description = "Migrates Angular 15.x applications to Angular 16. " +
-        "This includes removing `entryComponents` and `moduleId` from decorators, replacing `RouterLinkWithHref` with `RouterLink`, " +
-        "moving the `XhrFactory` import to `@angular/common`, and flagging removed APIs " +
-        "like `ReflectiveInjector`, `renderModuleFactory`, and `BrowserTransferStateModule`.";
+export class UpgradeToAngular16CodeChanges extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular16CodeChanges";
+    readonly displayName = "Upgrade to Angular 16 (code changes)";
+    readonly description = "The source changes of the Angular 16 migration, without the dependency version bumps. " +
+        "Use `UpgradeToAngular16` unless you are composing a migration to a later major.";
 
     async recipeList(): Promise<Recipe[]> {
         return [
-            // First, run Angular 15 migration
-            new UpgradeToAngular15(),
+            new UpgradeToAngular15CodeChanges(),
             // Code transformations
             new RemoveEntryComponents(),
             new RemoveModuleId(),
@@ -42,10 +39,29 @@ export class UpgradeToAngular16 extends Recipe {
             new FindRenderModuleFactoryUsage(),
             new FindBrowserTransferStateModuleUsage(),
             new FindRenderApplicationUsage(),
+        ];
+    }
+}
+
+export class UpgradeToAngular16 extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular16";
+    readonly displayName = "Upgrade to Angular 16";
+    readonly description = "Migrates Angular 15.x applications to Angular 16. " +
+        "This includes removing `entryComponents` and `moduleId` from decorators, replacing `RouterLinkWithHref` with `RouterLink`, " +
+        "moving the `XhrFactory` import to `@angular/common`, and flagging removed APIs " +
+        "like `ReflectiveInjector`, `renderModuleFactory`, and `BrowserTransferStateModule`.";
+
+    async recipeList(): Promise<Recipe[]> {
+        return [
+            new UpgradeToAngular16CodeChanges(),
             // Angular core packages
             await upgradeDependencyVersion({packagePattern: "@angular/*", newVersion: "16.x"}),
-            // Angular DevKit
-            await upgradeDependencyVersion({packagePattern: "@angular-devkit/*", newVersion: "16.x"}),
+            // Angular DevKit; `architect` and `build-webpack` kept the 0.<major><minor>.x CLI scheme
+            await upgradeDependencyVersion({packageName: "@angular-devkit/core", newVersion: "16.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/s*", newVersion: "16.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-angular", newVersion: "16.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/architect*", newVersion: "0.1602.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-webpack", newVersion: "0.1602.x"}),
             await upgradeDependencyVersion({packageName: "@schematics/angular", newVersion: "16.x"}),
             // zone.js
             await upgradeDependencyVersion({packageName: "zone.js", newVersion: "0.13.x"}),

package/src/migration/upgrade-to-angular-17.ts

@@ -6,11 +6,29 @@
 
 import {Recipe} from "@openrewrite/rewrite";
 import {upgradeDependencyVersion} from "@openrewrite/rewrite/javascript";
-import {UpgradeToAngular16} from "./upgrade-to-angular-16";
+import {UpgradeToAngular16CodeChanges} from "./upgrade-to-angular-16";
 import {ReplaceDeepZoneJsImports} from "./replace-deep-zone-js-imports";
 import {FindWithNoDomReuseUsage} from "../search/find-with-no-dom-reuse-usage";
 import {FindSetupTestingRouterUsage} from "../search/find-setup-testing-router-usage";
 
+export class UpgradeToAngular17CodeChanges extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular17CodeChanges";
+    readonly displayName = "Upgrade to Angular 17 (code changes)";
+    readonly description = "The source changes of the Angular 17 migration, without the dependency version bumps. " +
+        "Use `UpgradeToAngular17` unless you are composing a migration to a later major.";
+
+    async recipeList(): Promise<Recipe[]> {
+        return [
+            new UpgradeToAngular16CodeChanges(),
+            // Code transformations
+            new ReplaceDeepZoneJsImports(),
+            // Search: removed APIs
+            new FindWithNoDomReuseUsage(),
+            new FindSetupTestingRouterUsage(),
+        ];
+    }
+}
+
 export class UpgradeToAngular17 extends Recipe {
     readonly name = "org.openrewrite.angular.UpgradeToAngular17";
     readonly displayName = "Upgrade to Angular 17";
@@ -21,17 +39,15 @@ export class UpgradeToAngular17 extends Recipe {
 
     async recipeList(): Promise<Recipe[]> {
         return [
-            // First, run Angular 16 migration
-            new UpgradeToAngular16(),
-            // Code transformations
-            new ReplaceDeepZoneJsImports(),
-            // Search: removed APIs
-            new FindWithNoDomReuseUsage(),
-            new FindSetupTestingRouterUsage(),
+            new UpgradeToAngular17CodeChanges(),
             // Angular core packages
             await upgradeDependencyVersion({packagePattern: "@angular/*", newVersion: "17.x"}),
-            // Angular DevKit
-            await upgradeDependencyVersion({packagePattern: "@angular-devkit/*", newVersion: "17.x"}),
+            // Angular DevKit; `architect` and `build-webpack` kept the 0.<major><minor>.x CLI scheme
+            await upgradeDependencyVersion({packageName: "@angular-devkit/core", newVersion: "17.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/s*", newVersion: "17.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-angular", newVersion: "17.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/architect*", newVersion: "0.1703.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-webpack", newVersion: "0.1703.x"}),
             await upgradeDependencyVersion({packageName: "@schematics/angular", newVersion: "17.x"}),
             // zone.js
             await upgradeDependencyVersion({packageName: "zone.js", newVersion: "0.14.x"}),

package/src/migration/upgrade-to-angular-18.ts

@@ -6,7 +6,7 @@
 
 import {Recipe} from "@openrewrite/rewrite";
 import {ChangeImport, upgradeDependencyVersion} from "@openrewrite/rewrite/javascript";
-import {UpgradeToAngular17} from "./upgrade-to-angular-17";
+import {UpgradeToAngular17CodeChanges} from "./upgrade-to-angular-17";
 import {UpgradeAngularPeerLibsTo18} from "./upgrade-angular-peer-libs-to-18";
 import {ReplaceAsyncWithWaitForAsync} from "./replace-async-with-wait-for-async";
 import {ReplaceHttpClientModule} from "./replace-http-client-module";
@@ -17,18 +17,15 @@ import {FindResourceCacheProviderUsage} from "../search/find-resource-cache-prov
 import {FindTestabilityPendingRequestUsage} from "../search/find-testability-pending-request-usage";
 import {FindAnimationDriverMatchesElement} from "../search/find-animation-driver-matches-element";
 
-export class UpgradeToAngular18 extends Recipe {
-    readonly name = "org.openrewrite.angular.UpgradeToAngular18";
-    readonly displayName = "Upgrade to Angular 18";
-    readonly description = "Migrates Angular 17.x applications to Angular 18. " +
-        "This includes replacing the deprecated `async` test helper with `waitForAsync`, " +
-        "migrating `HttpClientModule` to `provideHttpClient()`, moving Transfer State APIs " +
-        "to `@angular/core`, and flagging removed platform APIs.";
+export class UpgradeToAngular18CodeChanges extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular18CodeChanges";
+    readonly displayName = "Upgrade to Angular 18 (code changes)";
+    readonly description = "The source changes of the Angular 18 migration, without the Angular dependency version bumps. " +
+        "Use `UpgradeToAngular18` unless you are composing a migration to a later major.";
 
     async recipeList(): Promise<Recipe[]> {
         return [
-            // First, run Angular 17 migration
-            new UpgradeToAngular17(),
+            new UpgradeToAngular17CodeChanges(),
             // Code transformations
             new ReplaceAsyncWithWaitForAsync(),
             new ReplaceHttpClientModule(),
@@ -55,19 +52,34 @@ export class UpgradeToAngular18 extends Recipe {
             new FindResourceCacheProviderUsage(),
             new FindTestabilityPendingRequestUsage(),
             new FindAnimationDriverMatchesElement(),
-            // Bump every package whose target follows the Angular major (18.x) in a single
-            // atomic npm install. upgradeDependencyVersion runs npm once per call, so packages
-            // that share a peer-dep graph MUST go in one matcher — otherwise a partial bump
-            // leaves the install failing with ERESOLVE. picomatch brace expansion lets us glob
-            // multiple package patterns in a single call.
-            await upgradeDependencyVersion({
-                packagePattern: "{@angular/*,@angular-devkit/*,@schematics/angular}",
-                newVersion: "18.x",
-            }),
-            // Bump well-known third-party Angular libraries (ng-bootstrap, ngx-bootstrap, …) to
-            // their Angular-18-compatible versions. Kept as a separate recipe so it can be run
-            // independently or extended without touching this file every time.
+            // Third-party libraries pinned to an Angular peer range (ng-bootstrap, ngx-bootstrap, …).
+            // There is no 19/20/21 equivalent yet, so this stays in the chained half: without it a
+            // migration to a later major would leave these libraries on a pre-18 line entirely.
             new UpgradeAngularPeerLibsTo18(),
+        ];
+    }
+}
+
+export class UpgradeToAngular18 extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular18";
+    readonly displayName = "Upgrade to Angular 18";
+    readonly description = "Migrates Angular 17.x applications to Angular 18. " +
+        "This includes replacing the deprecated `async` test helper with `waitForAsync`, " +
+        "migrating `HttpClientModule` to `provideHttpClient()`, moving Transfer State APIs " +
+        "to `@angular/core`, and flagging removed platform APIs.";
+
+    async recipeList(): Promise<Recipe[]> {
+        return [
+            new UpgradeToAngular18CodeChanges(),
+            // Angular core packages
+            await upgradeDependencyVersion({packagePattern: "@angular/*", newVersion: "18.x"}),
+            // Angular DevKit; `architect` and `build-webpack` kept the 0.<major><minor>.x CLI scheme
+            await upgradeDependencyVersion({packageName: "@angular-devkit/core", newVersion: "18.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/s*", newVersion: "18.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-angular", newVersion: "18.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/architect*", newVersion: "0.1802.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-webpack", newVersion: "0.1802.x"}),
+            await upgradeDependencyVersion({packageName: "@schematics/angular", newVersion: "18.x"}),
             // zone.js
             await upgradeDependencyVersion({packageName: "zone.js", newVersion: "0.14.x"}),
             // TypeScript: Angular 18 compiler requires >=5.4.0 <5.5.0

package/src/migration/upgrade-to-angular-19.ts

@@ -6,25 +6,22 @@
 
 import {Recipe} from "@openrewrite/rewrite";
 import {ChangeImport, upgradeDependencyVersion} from "@openrewrite/rewrite/javascript";
-import {UpgradeToAngular18} from "./upgrade-to-angular-18";
+import {UpgradeToAngular18CodeChanges} from "./upgrade-to-angular-18";
 import {ExplicitStandaloneFlag} from "./explicit-standalone-flag";
 import {RenamePendingTasks} from "./rename-pending-tasks";
 import {RemoveBrowserModuleWithServerTransition} from "./remove-browser-module-with-server-transition";
 import {FindEffectTimingUsage} from "../search/find-effect-timing-usage";
 import {FindEmptyProjectableNodes} from "../search/find-empty-projectable-nodes";
 
-export class UpgradeToAngular19 extends Recipe {
-    readonly name = "org.openrewrite.angular.UpgradeToAngular19";
-    readonly displayName = "Upgrade to Angular 19";
-    readonly description = "Migrates Angular 18.x applications to Angular 19. " +
-        "This includes updating Angular package versions, adjusting the standalone default, " +
-        "renaming `ExperimentalPendingTasks` to `PendingTasks`, moving the `ApplicationConfig` import " +
-        "to `@angular/core`, and updating `zone.js`.";
+export class UpgradeToAngular19CodeChanges extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular19CodeChanges";
+    readonly displayName = "Upgrade to Angular 19 (code changes)";
+    readonly description = "The source changes of the Angular 19 migration, without the dependency version bumps. " +
+        "Use `UpgradeToAngular19` unless you are composing a migration to a later major.";
 
     async recipeList(): Promise<Recipe[]> {
         return [
-            // First, run Angular 18 migration
-            new UpgradeToAngular18(),
+            new UpgradeToAngular18CodeChanges(),
             // Code transformations
             new ExplicitStandaloneFlag(),
             new RenamePendingTasks(),
@@ -37,10 +34,29 @@ export class UpgradeToAngular19 extends Recipe {
             // Behavioral change warnings
             new FindEffectTimingUsage(),
             new FindEmptyProjectableNodes(),
+        ];
+    }
+}
+
+export class UpgradeToAngular19 extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular19";
+    readonly displayName = "Upgrade to Angular 19";
+    readonly description = "Migrates Angular 18.x applications to Angular 19. " +
+        "This includes updating Angular package versions, adjusting the standalone default, " +
+        "renaming `ExperimentalPendingTasks` to `PendingTasks`, moving the `ApplicationConfig` import " +
+        "to `@angular/core`, and updating `zone.js`.";
+
+    async recipeList(): Promise<Recipe[]> {
+        return [
+            new UpgradeToAngular19CodeChanges(),
             // Angular core packages
             await upgradeDependencyVersion({packagePattern: "@angular/*", newVersion: "19.x"}),
-            // Angular DevKit
-            await upgradeDependencyVersion({packagePattern: "@angular-devkit/*", newVersion: "19.x"}),
+            // Angular DevKit; `architect` and `build-webpack` kept the 0.<major><minor>.x CLI scheme
+            await upgradeDependencyVersion({packageName: "@angular-devkit/core", newVersion: "19.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/s*", newVersion: "19.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-angular", newVersion: "19.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/architect*", newVersion: "0.1902.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-webpack", newVersion: "0.1902.x"}),
             await upgradeDependencyVersion({packageName: "@schematics/angular", newVersion: "19.x"}),
             // zone.js
             await upgradeDependencyVersion({packageName: "zone.js", newVersion: "0.15.x"}),

package/src/migration/upgrade-to-angular-20.ts

@@ -6,7 +6,7 @@
 
 import {Recipe} from "@openrewrite/rewrite";
 import {upgradeDependencyVersion} from "@openrewrite/rewrite/javascript";
-import {UpgradeToAngular19} from "./upgrade-to-angular-19";
+import {UpgradeToAngular19CodeChanges} from "./upgrade-to-angular-19";
 import {RenameZonelessProvider} from "./rename-zoneless-provider";
 import {RenameCheckNoChanges} from "./rename-check-no-changes";
 import {RenameAfterRender} from "./rename-after-render";
@@ -15,17 +15,15 @@ import {MoveDocumentImport} from "./move-document-to-core";
 import {RemoveStandaloneTrue} from "./remove-standalone-true";
 import {RemoveZoneJsPolyfill} from "./remove-zone-js-polyfill";
 
-export class UpgradeToAngular20 extends Recipe {
-    readonly name = "org.openrewrite.angular.UpgradeToAngular20";
-    readonly displayName = "Upgrade to Angular 20";
-    readonly description = "Migrates Angular 19.x applications to Angular 20. " +
-        "This includes running the Angular 19 migration first, then updating Angular package versions, " +
-        "renaming experimental APIs promoted to stable, and upgrading TypeScript to 5.8.x.";
+export class UpgradeToAngular20CodeChanges extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular20CodeChanges";
+    readonly displayName = "Upgrade to Angular 20 (code changes)";
+    readonly description = "The source changes of the Angular 20 migration, without the dependency version bumps. " +
+        "Use `UpgradeToAngular20` unless you are composing a migration to a later major.";
 
     async recipeList(): Promise<Recipe[]> {
         return [
-            // First, run Angular 19 migration
-            new UpgradeToAngular19(),
+            new UpgradeToAngular19CodeChanges(),
             // Code transformations
             new RenameZonelessProvider(),
             new RenameCheckNoChanges(),
@@ -34,10 +32,28 @@ export class UpgradeToAngular20 extends Recipe {
             new MoveDocumentImport(),
             new RemoveStandaloneTrue(),
             new RemoveZoneJsPolyfill(),
+        ];
+    }
+}
+
+export class UpgradeToAngular20 extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular20";
+    readonly displayName = "Upgrade to Angular 20";
+    readonly description = "Migrates Angular 19.x applications to Angular 20. " +
+        "This includes running the Angular 19 migration first, then updating Angular package versions, " +
+        "renaming experimental APIs promoted to stable, and upgrading TypeScript to 5.8.x.";
+
+    async recipeList(): Promise<Recipe[]> {
+        return [
+            new UpgradeToAngular20CodeChanges(),
             // Angular core packages
             await upgradeDependencyVersion({packagePattern: "@angular/*", newVersion: "20.x"}),
-            // Angular DevKit
-            await upgradeDependencyVersion({packagePattern: "@angular-devkit/*", newVersion: "20.x"}),
+            // Angular DevKit; `architect` and `build-webpack` kept the 0.<major><minor>.x CLI scheme
+            await upgradeDependencyVersion({packageName: "@angular-devkit/core", newVersion: "20.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/s*", newVersion: "20.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-angular", newVersion: "20.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/architect*", newVersion: "0.2003.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-webpack", newVersion: "0.2003.x"}),
             await upgradeDependencyVersion({packageName: "@schematics/angular", newVersion: "20.x"}),
             // TypeScript
             await upgradeDependencyVersion({packageName: "typescript", newVersion: "5.8.x"}),

package/src/migration/upgrade-to-angular-21.ts

@@ -6,7 +6,7 @@
 
 import {Recipe} from "@openrewrite/rewrite";
 import {upgradeDependencyVersion} from "@openrewrite/rewrite/javascript";
-import {UpgradeToAngular20} from "./upgrade-to-angular-20";
+import {UpgradeToAngular20CodeChanges} from "./upgrade-to-angular-20";
 import {FindKarmaUsage} from "../search/find-karma-usage";
 import {FindCommonModuleUsage} from "../search/find-common-module-usage";
 import {FindNgClassUsage} from "../search/find-ng-class-usage";
@@ -17,18 +17,15 @@ import {MigrateInputToSignal} from "./migrate-input-to-signal";
 import {MigrateOutputToSignal} from "./migrate-output-to-signal";
 import {MigrateQueryToSignal} from "./migrate-query-to-signal";
 
-export class UpgradeToAngular21 extends Recipe {
-    readonly name = "org.openrewrite.angular.UpgradeToAngular21";
-    readonly displayName = "Upgrade to Angular 21";
-    readonly description = "Migrates Angular 20.x applications to Angular 21. " +
-        "This includes running the Angular 20 migration first, flagging Karma test runner usage " +
-        "for Vitest migration, deprecated NgClass, zone.js-dependent test helpers, " +
-        "and upgrading TypeScript to 5.9.x.";
+export class UpgradeToAngular21CodeChanges extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular21CodeChanges";
+    readonly displayName = "Upgrade to Angular 21 (code changes)";
+    readonly description = "The source changes of the Angular 21 migration, without the dependency version bumps. " +
+        "Use `UpgradeToAngular21` unless you are composing a migration to a later major.";
 
     async recipeList(): Promise<Recipe[]> {
         return [
-            // First, run Angular 20 migration
-            new UpgradeToAngular20(),
+            new UpgradeToAngular20CodeChanges(),
             // Deprecation and behavioral change warnings
             new FindKarmaUsage(),
             new FindCommonModuleUsage(),
@@ -40,10 +37,29 @@ export class UpgradeToAngular21 extends Recipe {
             new MigrateInputToSignal(),
             new MigrateOutputToSignal(),
             new MigrateQueryToSignal(),
+        ];
+    }
+}
+
+export class UpgradeToAngular21 extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular21";
+    readonly displayName = "Upgrade to Angular 21";
+    readonly description = "Migrates Angular 20.x applications to Angular 21. " +
+        "This includes running the Angular 20 migration first, flagging Karma test runner usage " +
+        "for Vitest migration, deprecated NgClass, zone.js-dependent test helpers, " +
+        "and upgrading TypeScript to 5.9.x.";
+
+    async recipeList(): Promise<Recipe[]> {
+        return [
+            new UpgradeToAngular21CodeChanges(),
             // Angular core packages
             await upgradeDependencyVersion({packagePattern: "@angular/*", newVersion: "21.x"}),
-            // Angular DevKit
-            await upgradeDependencyVersion({packagePattern: "@angular-devkit/*", newVersion: "21.x"}),
+            // Angular DevKit; `architect` and `build-webpack` kept the 0.<major><minor>.x CLI scheme
+            await upgradeDependencyVersion({packageName: "@angular-devkit/core", newVersion: "21.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/s*", newVersion: "21.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-angular", newVersion: "21.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/architect*", newVersion: "0.2102.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-webpack", newVersion: "0.2102.x"}),
             await upgradeDependencyVersion({packageName: "@schematics/angular", newVersion: "21.x"}),
             // TypeScript
             await upgradeDependencyVersion({packageName: "typescript", newVersion: "5.9.x"}),

package/src/migration/upgrade-to-angular-8.ts

@@ -13,6 +13,33 @@ import {FindPlatformWebworkerUsage} from "../search/find-platform-webworker-usag
 import {FindRxjsCompatUsage} from "../search/find-rxjs-compat-usage";
 import {ReplaceLoadChildrenString} from "./replace-load-children-string";
 
+/**
+ * Source changes only. Later majors chain this instead of `UpgradeToAngular8` so they don't
+ * inherit its dependency ladder — only the target major's versions should end up in the patch.
+ */
+export class UpgradeToAngular8CodeChanges extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular8CodeChanges";
+    readonly displayName = "Upgrade to Angular 8 (code changes)";
+    readonly description = "The source changes of the Angular 8 migration, without the dependency version bumps. " +
+        "Use `UpgradeToAngular8` unless you are composing a migration to a later major.";
+
+    async recipeList(): Promise<Recipe[]> {
+        return [
+            // Code transformations
+            new AddStaticFalseToViewQueries(),
+            new MoveDocumentImport({targetModule: '@angular/common'}),
+            // Search: removed/deprecated APIs
+            new FindRxjsCompatUsage(),
+            new ReplaceLoadChildrenString(),
+            new FindAngularHttpUsage(),
+            new FindPlatformWebworkerUsage(),
+            // Remove rxjs-compat (RxJS 5→6 shim no longer needed). A one-shot removal rather than a
+            // version bump, so it lives here where migrations to later majors still pick it up.
+            await removeDependency({packageName: "rxjs-compat"}),
+        ];
+    }
+}
+
 export class UpgradeToAngular8 extends Recipe {
     readonly name = "org.openrewrite.angular.UpgradeToAngular8";
     readonly displayName = "Upgrade to Angular 8";
@@ -26,22 +53,16 @@ export class UpgradeToAngular8 extends Recipe {
 
     async recipeList(): Promise<Recipe[]> {
         return [
-            // Code transformations
-            new AddStaticFalseToViewQueries(),
-            new MoveDocumentImport({targetModule: '@angular/common'}),
-            // Search: removed/deprecated APIs
-            new FindRxjsCompatUsage(),
-            new ReplaceLoadChildrenString(),
-            new FindAngularHttpUsage(),
-            new FindPlatformWebworkerUsage(),
-            // Remove rxjs-compat (RxJS 5→6 shim no longer needed)
-            await removeDependency({packageName: "rxjs-compat"}),
+            new UpgradeToAngular8CodeChanges(),
             // Angular core packages
             await upgradeDependencyVersion({packagePattern: "@angular/*", newVersion: "8.x"}),
-            // Angular CDK
-            await upgradeDependencyVersion({packageName: "@angular/cdk", newVersion: "8.x"}),
-            // Angular DevKit
-            await upgradeDependencyVersion({packagePattern: "@angular-devkit/*", newVersion: "8.x"}),
+            // Angular DevKit; before Angular 12 the CLI-aligned packages used the 0.<major><minor>.x scheme
+            await upgradeDependencyVersion({packageName: "@angular-devkit/core", newVersion: "8.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/schematics", newVersion: "8.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-angular", newVersion: "0.803.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/schematics-cli", newVersion: "0.803.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/architect*", newVersion: "0.803.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-webpack", newVersion: "0.803.x"}),
             await upgradeDependencyVersion({packageName: "@schematics/angular", newVersion: "8.x"}),
             // zone.js
             await upgradeDependencyVersion({packageName: "zone.js", newVersion: "0.9.x"}),

package/src/migration/upgrade-to-angular-9.ts

@@ -6,7 +6,7 @@
 
 import {Recipe} from "@openrewrite/rewrite";
 import {upgradeDependencyVersion} from "@openrewrite/rewrite/javascript";
-import {UpgradeToAngular8} from "./upgrade-to-angular-8";
+import {UpgradeToAngular8CodeChanges} from "./upgrade-to-angular-8";
 import {RemoveStaticFalse} from "./remove-static-false";
 import {EnableAotBuild} from "./enable-aot-build";
 import {UpdateTsconfigModule} from "./update-tsconfig-module";
@@ -21,21 +21,15 @@ import {FindAnalyzeForEntryComponentsUsage} from "../search/find-analyze-for-ent
 import {ReplaceTestBedGetWithInject} from "./replace-testbed-get-with-inject";
 import {AddModuleWithProvidersGeneric} from "./add-module-with-providers-generic";
 
-export class UpgradeToAngular9 extends Recipe {
-    readonly name = "org.openrewrite.angular.UpgradeToAngular9";
-    readonly displayName = "Upgrade to Angular 9";
-    readonly description = "Migrates Angular 8.x applications to Angular 9. " +
-        "This includes removing the now-default `static: false` from view query decorators, " +
-        "replacing `TestBed.get()` with `TestBed.inject()`, " +
-        "adding generic type parameters to `ModuleWithProviders`, " +
-        "enabling AOT compilation in `angular.json`, " +
-        "updating `tsconfig.json` module settings for Ivy, " +
-        "flagging removed View Engine APIs (`Renderer`, `RenderComponentType`, `RootRenderer`), " +
-        "and upgrading Angular, TypeScript, and related dependency versions.";
+export class UpgradeToAngular9CodeChanges extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular9CodeChanges";
+    readonly displayName = "Upgrade to Angular 9 (code changes)";
+    readonly description = "The source changes of the Angular 9 migration, without the dependency version bumps. " +
+        "Use `UpgradeToAngular9` unless you are composing a migration to a later major.";
 
     async recipeList(): Promise<Recipe[]> {
         return [
-            new UpgradeToAngular8(),
+            new UpgradeToAngular8CodeChanges(),
             // Code transformations
             new RemoveStaticFalse(),
             new EnableAotBuild(),
@@ -51,12 +45,34 @@ export class UpgradeToAngular9 extends Recipe {
             new FindUndecoratedAngularClass(),
             new FindMissingInjectable(),
             new FindAnalyzeForEntryComponentsUsage(),
+        ];
+    }
+}
+
+export class UpgradeToAngular9 extends Recipe {
+    readonly name = "org.openrewrite.angular.UpgradeToAngular9";
+    readonly displayName = "Upgrade to Angular 9";
+    readonly description = "Migrates Angular 8.x applications to Angular 9. " +
+        "This includes removing the now-default `static: false` from view query decorators, " +
+        "replacing `TestBed.get()` with `TestBed.inject()`, " +
+        "adding generic type parameters to `ModuleWithProviders`, " +
+        "enabling AOT compilation in `angular.json`, " +
+        "updating `tsconfig.json` module settings for Ivy, " +
+        "flagging removed View Engine APIs (`Renderer`, `RenderComponentType`, `RootRenderer`), " +
+        "and upgrading Angular, TypeScript, and related dependency versions.";
+
+    async recipeList(): Promise<Recipe[]> {
+        return [
+            new UpgradeToAngular9CodeChanges(),
             // Angular core packages
             await upgradeDependencyVersion({packagePattern: "@angular/*", newVersion: "9.x"}),
-            // Angular CDK
-            await upgradeDependencyVersion({packageName: "@angular/cdk", newVersion: "9.x"}),
-            // Angular DevKit
-            await upgradeDependencyVersion({packagePattern: "@angular-devkit/*", newVersion: "9.x"}),
+            // Angular DevKit; before Angular 12 the CLI-aligned packages used the 0.<major><minor>.x scheme
+            await upgradeDependencyVersion({packageName: "@angular-devkit/core", newVersion: "9.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/schematics", newVersion: "9.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-angular", newVersion: "0.901.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/schematics-cli", newVersion: "0.901.x"}),
+            await upgradeDependencyVersion({packagePattern: "@angular-devkit/architect*", newVersion: "0.901.x"}),
+            await upgradeDependencyVersion({packageName: "@angular-devkit/build-webpack", newVersion: "0.901.x"}),
             await upgradeDependencyVersion({packageName: "@schematics/angular", newVersion: "9.x"}),
             // zone.js
             await upgradeDependencyVersion({packageName: "zone.js", newVersion: "0.10.x"}),