feat(angular): add convert-to-rspack generator (#29860)

## Current Behavior
Nx currently does not offer an automated method for switching from an
Angular Webpack build to an Angular Rspack build.

## Expected Behavior
Provide a generator `convert-to-rspack` in `@nx/angular` that will allow
conversion from an Angular Webpack build to an Angular Rspack build.

Usage: `nx g convert-to-rspack --project=myapp`

## TODO
- [x] handle more builder options
- [x] take existing custom webpack configs and migrate into the rspack
config that is created

Author: Coly010

docs/generated/manifests/menus.json

@@ -7314,6 +7314,14 @@
                 "isExternal": false,
                 "disableCollapsible": false
               },
+              {
+                "id": "convert-to-rspack",
+                "path": "/nx-api/angular/generators/convert-to-rspack",
+                "name": "convert-to-rspack",
+                "children": [],
+                "isExternal": false,
+                "disableCollapsible": false
+              },
               {
                 "id": "directive",
                 "path": "/nx-api/angular/generators/directive",

docs/generated/manifests/nx-api.json

@@ -208,6 +208,15 @@
         "path": "/nx-api/angular/generators/convert-to-application-executor",
         "type": "generator"
       },
+      "/nx-api/angular/generators/convert-to-rspack": {
+        "description": "Converts Angular Webpack projects to use Rspack.",
+        "file": "generated/packages/angular/generators/convert-to-rspack.json",
+        "hidden": false,
+        "name": "convert-to-rspack",
+        "originalFilePath": "/packages/angular/src/generators/convert-to-rspack/schema.json",
+        "path": "/nx-api/angular/generators/convert-to-rspack",
+        "type": "generator"
+      },
       "/nx-api/angular/generators/directive": {
         "description": "Generate an Angular directive.",
         "file": "generated/packages/angular/generators/directive.json",

docs/generated/packages-metadata.json

@@ -203,6 +203,15 @@
         "path": "angular/generators/convert-to-application-executor",
         "type": "generator"
       },
+      {
+        "description": "Converts Angular Webpack projects to use Rspack.",
+        "file": "generated/packages/angular/generators/convert-to-rspack.json",
+        "hidden": false,
+        "name": "convert-to-rspack",
+        "originalFilePath": "/packages/angular/src/generators/convert-to-rspack/schema.json",
+        "path": "angular/generators/convert-to-rspack",
+        "type": "generator"
+      },
       {
         "description": "Generate an Angular directive.",
         "file": "generated/packages/angular/generators/directive.json",

docs/generated/packages/angular/generators/convert-to-rspack.json

@@ -0,0 +1,38 @@
+{
+  "name": "convert-to-rspack",
+  "factory": "./src/generators/convert-to-rspack/convert-to-rspack",
+  "schema": {
+    "$schema": "https://json-schema.org/schema",
+    "$id": "GeneratorNxApp",
+    "title": "Creates an Angular application.",
+    "description": "Creates an Angular application.",
+    "type": "object",
+    "cli": "nx",
+    "properties": {
+      "project": {
+        "type": "string",
+        "aliases": ["name", "projectName"],
+        "description": "Project for which to convert to rspack.",
+        "$default": { "$source": "argv", "index": 0 },
+        "x-priority": "important"
+      },
+      "skipFormat": {
+        "description": "Skip formatting files.",
+        "type": "boolean",
+        "default": false
+      },
+      "skipInstall": {
+        "description": "Skip installing dependencies.",
+        "type": "boolean",
+        "default": false
+      }
+    },
+    "presets": []
+  },
+  "description": "Converts Angular Webpack projects to use Rspack.",
+  "implementation": "/packages/angular/src/generators/convert-to-rspack/convert-to-rspack.ts",
+  "aliases": [],
+  "hidden": false,
+  "path": "/packages/angular/src/generators/convert-to-rspack/schema.json",
+  "type": "generator"
+}

docs/shared/reference/sitemap.md

@@ -366,6 +366,7 @@
       - [component-story](/nx-api/angular/generators/component-story)
       - [component-test](/nx-api/angular/generators/component-test)
       - [convert-to-application-executor](/nx-api/angular/generators/convert-to-application-executor)
+      - [convert-to-rspack](/nx-api/angular/generators/convert-to-rspack)
       - [directive](/nx-api/angular/generators/directive)
       - [federate-module](/nx-api/angular/generators/federate-module)
       - [init](/nx-api/angular/generators/init)

e2e/angular/src/misc.test.ts

@@ -144,3 +144,25 @@ describe('Move Angular Project', () => {
     expect(lib2File).toContain(`extends ${newModule}`);
   });
 });
+
+describe('Convert Angular Webpack Project to Rspack', () => {
+  let proj: string;
+  let app1: string;
+
+  beforeAll(() => {
+    proj = newProject({ packages: ['@nx/angular'] });
+    app1 = uniq('app1');
+    runCLI(
+      `generate @nx/angular:app ${app1} --bundler=webpack --no-interactive`
+    );
+  });
+
+  afterAll(() => cleanupProject());
+
+  it('should convert an Angular Webpack project to Rspack', async () => {
+    runCLI(`generate @nx/angular:convert-to-rspack --project=${app1}`);
+    const buildOutput = runCLI(`build ${app1}`);
+    expect(buildOutput).toContain('rspack build');
+    expect(buildOutput).toContain('browser compiled');
+  });
+});

packages/angular/generators.json

@@ -38,6 +38,11 @@
       "schema": "./src/generators/convert-to-application-executor/schema.json",
       "description": "Converts projects to use the `@nx/angular:application` executor or the `@angular-devkit/build-angular:application` builder."
     },
+    "convert-to-rspack": {
+      "factory": "./src/generators/convert-to-rspack/convert-to-rspack",
+      "schema": "./src/generators/convert-to-rspack/schema.json",
+      "description": "Converts Angular Webpack projects to use Rspack."
+    },
     "directive": {
       "factory": "./src/generators/directive/directive",
       "schema": "./src/generators/directive/schema.json",

packages/angular/package.json

@@ -50,6 +50,7 @@
   "dependencies": {
     "@phenomnomnominal/tsquery": "~5.0.1",
     "@typescript-eslint/type-utils": "^8.0.0",
+    "enquirer": "~2.3.6",
     "picocolors": "^1.1.0",
     "magic-string": "~0.30.2",
     "minimatch": "9.0.3",
@@ -60,6 +61,7 @@
     "@nx/js": "file:../js",
     "@nx/eslint": "file:../eslint",
     "@nx/webpack": "file:../webpack",
+    "@nx/rspack": "file:../rspack",
     "@nx/module-federation": "file:../module-federation",
     "@nx/web": "file:../web",
     "@nx/workspace": "file:../workspace",