@nx/angular 23.0.0-beta.20 → 23.0.0-beta.22

package/src/migrations/update-20-2-0/disable-angular-eslint-prefer-standalone.md

@@ -0,0 +1,475 @@
+#### Disable Angular ESLint Prefer Standalone
+
+Disable the Angular ESLint prefer-standalone rule if not set.
+
+#### Sample Code Changes
+
+Update import paths for `withModuleFederation` and `withModuleFederationForSSR`.
+
+##### Before
+
+```json title="apps/app1/.eslintrc.json"
+{
+  "overrides": [
+    {
+      "files": ["*.html"],
+      "rules": {
+        "some-rule-for-html": "error"
+      }
+    }
+  ]
+}
+```
+
+##### After
+
+```json title="apps/app1/.eslintrc.json"
+{
+  "overrides": [
+    {
+      "files": ["*.html"],
+      "rules": {
+        "some-rule-for-html": "error"
+      }
+    },
+    {
+      "files": ["*.ts"],
+      "rules": {
+        "@angular-eslint/prefer-standalone": "off"
+      }
+    }
+  ]
+}
+```
+
+import {
+addProjectConfiguration,
+writeJson,
+type ProjectConfiguration,
+type ProjectGraph,
+type Tree,
+} from '@nx/devkit';
+import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
+import migration from './disable-angular-eslint-prefer-standalone';
+
+let projectGraph: ProjectGraph;
+jest.mock('@nx/devkit', () => ({
+...jest.requireActual('@nx/devkit'),
+createProjectGraphAsync: () => Promise.resolve(projectGraph),
+}));
+
+describe('disable-angular-eslint-prefer-standalone', () => {
+let tree: Tree;
+
+beforeEach(() => {
+tree = createTreeWithEmptyWorkspace();
+
+    const projectConfig: ProjectConfiguration = {
+      name: 'app1',
+      root: 'apps/app1',
+    };
+    projectGraph = {
+      dependencies: {
+        app1: [
+          {
+            source: 'app1',
+            target: 'npm:@angular/core',
+            type: 'static',
+          },
+        ],
+      },
+      nodes: {
+        app1: {
+          data: projectConfig,
+          name: 'app1',
+          type: 'app',
+        },
+      },
+    };
+    addProjectConfiguration(tree, projectConfig.name, projectConfig);
+
+});
+
+describe('.eslintrc.json', () => {
+it('should not disable @angular-eslint/prefer-standalone when it is set', async () => {
+writeJson(tree, 'apps/app1/.eslintrc.json', {
+overrides: [
+{
+files: ['*.ts'],
+rules: { '@angular-eslint/prefer-standalone': ['error'] },
+},
+],
+});
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/.eslintrc.json', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "{
+          "overrides": [
+            {
+              "files": ["*.ts"],
+              "rules": {
+                "@angular-eslint/prefer-standalone": ["error"]
+              }
+            }
+          ]
+        }
+        "
+      `);
+    });
+
+    it('should not disable @angular-eslint/prefer-standalone when there are multiple overrides for angular eslint and the rule is set in one of them', async () => {
+      writeJson(tree, 'apps/app1/.eslintrc.json', {
+        overrides: [
+          {
+            files: ['*.ts'],
+            rules: {
+              '@angular-eslint/directive-selector': [
+                'error',
+                { type: 'attribute', prefix: 'app', style: 'camelCase' },
+              ],
+            },
+          },
+          {
+            files: ['*.ts'],
+            rules: { '@angular-eslint/prefer-standalone': ['error'] },
+          },
+        ],
+      });
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/.eslintrc.json', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "{
+          "overrides": [
+            {
+              "files": ["*.ts"],
+              "rules": {
+                "@angular-eslint/directive-selector": [
+                  "error",
+                  {
+                    "type": "attribute",
+                    "prefix": "app",
+                    "style": "camelCase"
+                  }
+                ]
+              }
+            },
+            {
+              "files": ["*.ts"],
+              "rules": {
+                "@angular-eslint/prefer-standalone": ["error"]
+              }
+            }
+          ]
+        }
+        "
+      `);
+    });
+
+    it('should disable @angular-eslint/prefer-standalone in an existing override for angular eslint', async () => {
+      writeJson(tree, 'apps/app1/.eslintrc.json', {
+        overrides: [
+          {
+            files: ['*.ts'],
+            rules: { 'no-unused-vars': 'error' },
+          },
+          {
+            files: ['*.ts'],
+            rules: {
+              '@angular-eslint/directive-selector': [
+                'error',
+                { type: 'attribute', prefix: 'app', style: 'camelCase' },
+              ],
+            },
+          },
+        ],
+      });
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/.eslintrc.json', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "{
+          "overrides": [
+            {
+              "files": ["*.ts"],
+              "rules": {
+                "no-unused-vars": "error"
+              }
+            },
+            {
+              "files": ["*.ts"],
+              "rules": {
+                "@angular-eslint/directive-selector": [
+                  "error",
+                  {
+                    "type": "attribute",
+                    "prefix": "app",
+                    "style": "camelCase"
+                  }
+                ],
+                "@angular-eslint/prefer-standalone": "off"
+              }
+            }
+          ]
+        }
+        "
+      `);
+    });
+
+    it('should disable @angular-eslint/prefer-standalone in an existing override for ts files', async () => {
+      writeJson(tree, 'apps/app1/.eslintrc.json', {
+        overrides: [
+          {
+            files: ['*.ts'],
+            rules: { 'no-unused-vars': 'error' },
+          },
+        ],
+      });
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/.eslintrc.json', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "{
+          "overrides": [
+            {
+              "files": ["*.ts"],
+              "rules": {
+                "no-unused-vars": "error",
+                "@angular-eslint/prefer-standalone": "off"
+              }
+            }
+          ]
+        }
+        "
+      `);
+    });
+
+    it('should disable @angular-eslint/prefer-standalone in a new override', async () => {
+      writeJson(tree, 'apps/app1/.eslintrc.json', {
+        overrides: [
+          {
+            files: ['*.html'],
+            rules: { 'some-rule-for-html': 'error' },
+          },
+        ],
+      });
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/.eslintrc.json', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "{
+          "overrides": [
+            {
+              "files": ["*.html"],
+              "rules": {
+                "some-rule-for-html": "error"
+              }
+            },
+            {
+              "files": ["*.ts"],
+              "rules": {
+                "@angular-eslint/prefer-standalone": "off"
+              }
+            }
+          ]
+        }
+        "
+      `);
+    });
+
+});
+
+describe('flat config', () => {
+it('should not disable @angular-eslint/prefer-standalone when it is set', async () => {
+tree.write('eslint.config.js', 'module.exports = [];');
+tree.write(
+'apps/app1/eslint.config.js',
+`module.exports = [
+          {
+            files: ['*.ts'],
+            rules: { '@angular-eslint/prefer-standalone': ['error'] },
+          },
+        ];
+        `
+);
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/eslint.config.js', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "module.exports = [
+          {
+            files: ['*.ts'],
+            rules: { '@angular-eslint/prefer-standalone': ['error'] },
+          },
+        ];
+        "
+      `);
+    });
+
+    it('should not disable @angular-eslint/prefer-standalone when there are multiple overrides for angular eslint and the rule is set in one of them', async () => {
+      tree.write('eslint.config.js', 'module.exports = [];');
+      tree.write(
+        'apps/app1/eslint.config.js',
+        `module.exports = [
+          {
+            files: ['*.ts'],
+            rules: {
+              '@angular-eslint/directive-selector': [
+                'error',
+                { type: 'attribute', prefix: 'app', style: 'camelCase' },
+              ],
+            },
+          },
+          {
+            files: ['*.ts'],
+            rules: { '@angular-eslint/prefer-standalone': ['error'] },
+          },
+        ];
+        `
+      );
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/eslint.config.js', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "module.exports = [
+          {
+            files: ['*.ts'],
+            rules: {
+              '@angular-eslint/directive-selector': [
+                'error',
+                { type: 'attribute', prefix: 'app', style: 'camelCase' },
+              ],
+            },
+          },
+          {
+            files: ['*.ts'],
+            rules: { '@angular-eslint/prefer-standalone': ['error'] },
+          },
+        ];
+        "
+      `);
+    });
+
+    it('should disable @angular-eslint/prefer-standalone in an existing override for angular eslint', async () => {
+      tree.write('eslint.config.js', 'module.exports = [];');
+      tree.write(
+        'apps/app1/eslint.config.js',
+        `module.exports = [
+          {
+            files: ['*.ts'],
+            rules: { 'no-unused-vars': 'error' },
+          },
+          {
+            files: ['*.ts'],
+            rules: {
+              '@angular-eslint/directive-selector': [
+                'error',
+                { type: 'attribute', prefix: 'app', style: 'camelCase' },
+              ],
+            },
+          },
+        ];
+        `
+      );
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/eslint.config.js', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "module.exports = [
+          {
+            files: ['*.ts'],
+            rules: { 'no-unused-vars': 'error' },
+          },
+          {
+            files: ['**/*.ts'],
+            rules: {
+              '@angular-eslint/directive-selector': [
+                'error',
+                {
+                  type: 'attribute',
+                  prefix: 'app',
+                  style: 'camelCase',
+                },
+              ],
+              '@angular-eslint/prefer-standalone': 'off',
+            },
+          },
+        ];
+        "
+      `);
+    });
+
+    it('should disable @angular-eslint/prefer-standalone in an existing override for ts files', async () => {
+      tree.write('eslint.config.js', 'module.exports = [];');
+      tree.write(
+        'apps/app1/eslint.config.js',
+        `module.exports = [
+          {
+            files: ['*.ts'],
+            rules: { 'no-unused-vars': 'error' },
+          },
+        ];
+        `
+      );
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/eslint.config.js', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "module.exports = [
+          {
+            files: ['**/*.ts'],
+            rules: {
+              'no-unused-vars': 'error',
+              '@angular-eslint/prefer-standalone': 'off',
+            },
+          },
+        ];
+        "
+      `);
+    });
+
+    it('should disable @angular-eslint/prefer-standalone in a new override', async () => {
+      tree.write('eslint.config.js', 'module.exports = [];');
+      tree.write(
+        'apps/app1/eslint.config.js',
+        `module.exports = [
+          {
+            files: ['*.html'],
+            rules: { 'some-rule-for-html': 'error' },
+          },
+        ];
+        `
+      );
+
+      await migration(tree);
+
+      expect(tree.read('apps/app1/eslint.config.js', 'utf8'))
+        .toMatchInlineSnapshot(`
+        "module.exports = [
+          {
+            files: ['*.html'],
+            rules: { 'some-rule-for-html': 'error' },
+          },
+          {
+            files: ['**/*.ts'],
+            rules: {
+              '@angular-eslint/prefer-standalone': 'off',
+            },
+          },
+        ];
+        "
+      `);
+    });
+
+});
+});

package/src/migrations/update-20-2-0/migrate-mf-imports-to-new-package.md

@@ -0,0 +1,19 @@
+#### Migrate Module Federation Imports to New Package
+
+Update the ModuleFederationConfig imports to use @nx/module-federation.
+
+#### Sample Code Changes
+
+Update import paths for ModuleFederationConfig.
+
+##### Before
+
+```js title="apps/shell/webpack.config.js"
+import { ModuleFederationConfig } from '@nx/webpack';
+```
+
+##### After
+
+```js title="apps/shell/webpack.config.js"
+import { ModuleFederationConfig } from '@nx/module-federation';
+```

package/src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package.md

@@ -0,0 +1,25 @@
+#### Migrate withModuleFederation Import to New Package
+
+Update the withModuleFederation import to use @nx/module-federation/webpack.
+
+#### Sample Code Changes
+
+Update import paths for `withModuleFederation` and `withModuleFederationForSSR`.
+
+##### Before
+
+```ts title="apps/shell/webpack.config.ts"
+import {
+  withModuleFederation,
+  withModuleFederationForSSR,
+} from '@nx/angular/module-federation';
+```
+
+##### After
+
+```ts title="apps/shell/webpack.config.ts"
+import {
+  withModuleFederation,
+  withModuleFederationForSSR,
+} from '@nx/module-federation/angular';
+```

package/src/migrations/update-20-2-0/remove-angular-eslint-rules.md

@@ -0,0 +1,37 @@
+#### Remove Angular ESLint Rules
+
+Remove Angular ESLint rules that were removed in v19.0.0.
+
+#### Sample Code Changes
+
+Removes `@angular-eslint/no-host-metadata-property`, `@angular-eslint/sort-ngmodule-metadata-arrays` and `@angular-eslint/prefer-standalone-component` from any ESLint config file. Files to be searched include `.eslintrc.json`, `.eslintrc.base.json`, `.eslint.config.js` and `.eslint.config.base.js`.
+
+##### Before
+
+```json title="apps/app1/.eslintrc.json"
+{
+  "overrides": [
+    {
+      "files": ["*.ts"],
+      "rules": {
+        "@angular-eslint/no-host-metadata-property": ["error"],
+        "@angular-eslint/sort-ngmodule-metadata-arrays": ["error"],
+        "@angular-eslint/prefer-standalone-component": ["error"]
+      }
+    }
+  ]
+}
+```
+
+##### After
+
+```json title="apps/app1/.eslintrc.json"
+{
+  "overrides": [
+    {
+      "files": ["*.ts"],
+      "rules": {}
+    }
+  ]
+}
+```

package/src/migrations/update-20-2-0/remove-tailwind-config-from-ng-packagr-executors.md

@@ -0,0 +1,69 @@
+#### Remove tailwindConfig from ng-packagr Executors
+
+Remove the deprecated 'tailwindConfig' option from ng-packagr executors. Tailwind CSS configurations located at the project or workspace root will be picked up automatically.
+
+#### Sample Code Changes
+
+Remove `tailwindConfig` from the `@nx/angular:ng-packagr-lite` or `@nx/angular:package` executor options in project configuration.
+
+##### Before
+
+```json title="libs/my-lib/project.json"
+{
+  "targets": {
+    "build": {
+      "executor": "@nx/angular:ng-packagr-lite",
+      "options": {
+        "project": "libs/lib1/ng-package.json",
+        "tailwindConfig": "libs/lib1/tailwind.config.js"
+      }
+    }
+  }
+}
+```
+
+##### After
+
+```json title="libs/my-lib/project.json"
+{
+  "targets": {
+    "build": {
+      "executor": "@nx/angular:ng-packagr-lite",
+      "options": {
+        "project": "libs/lib1/ng-package.json"
+      }
+    }
+  }
+}
+```
+
+Remove `tailwindConfig` from the `@nx/angular:ng-packagr-lite` or `@nx/angular:package` executor target defaults in `nx.json`.
+
+##### Before
+
+```json title="nx.json"
+{
+  "targetDefaults": {
+    "@nx/angular:ng-packagr-lite": {
+      "options": {
+        "project": "{projectRoot}/ng-package.json",
+        "tailwindConfig": "{projectRoot}/tailwind.config.js"
+      }
+    }
+  }
+}
+```
+
+##### After
+
+```json title="nx.json"
+{
+  "targetDefaults": {
+    "@nx/angular:ng-packagr-lite": {
+      "options": {
+        "project": "{projectRoot}/ng-package.json"
+      }
+    }
+  }
+}
+```

package/src/migrations/update-20-2-0/update-angular-cli.md

@@ -0,0 +1,49 @@
+#### Update `@angular/cli` to `~19.0.0`
+
+Update the version of the Angular CLI if it is specified in `package.json`
+
+#### Sample Code Changes
+
+Update in `devDependencies`:
+
+##### Before
+
+```json title="package.json"
+{
+  "devDependencies": {
+    "@angular/cli": "~13.3.0"
+  }
+}
+```
+
+##### After
+
+```json title="package.json"
+{
+  "devDependencies": {
+    "@angular/cli": "~19.0.0"
+  }
+}
+```
+
+Update in `dependencies`:
+
+##### Before
+
+```json title="package.json"
+{
+  "dependencies": {
+    "@angular/cli": "~13.3.0"
+  }
+}
+```
+
+##### After
+
+```json title="package.json"
+{
+  "dependencies": {
+    "@angular/cli": "~19.0.0"
+  }
+}
+```

package/src/migrations/update-20-2-0/update-angular-ssr-imports-to-use-node-entry-point.md

@@ -0,0 +1,27 @@
+#### Update Angular SSR Imports to Use Node Entry Point
+
+Update '@angular/ssr' import paths to use the new '/node' entry point when 'CommonEngine' is detected.
+
+#### Sample Code Changes
+
+Update import paths for SSR CommonEngine properties to use `@angular/ssr/node`.
+
+##### Before
+
+```ts title="apps/app1/server.ts"
+import { CommonEngine } from '@angular/ssr';
+import type {
+  CommonEngineOptions,
+  CommonEngineRenderOptions,
+} from '@angular/ssr';
+```
+
+##### After
+
+```ts title="apps/app1/server.ts"
+import { CommonEngine } from '@angular/ssr/node';
+import type {
+  CommonEngineOptions,
+  CommonEngineRenderOptions,
+} from '@angular/ssr/node';
+```