@nx/angular 20.2.0-canary.20241204-75b2080 → 20.2.0-rc.0

package/generators.json

@@ -73,7 +73,8 @@
       "factory": "./src/generators/remote/remote",
       "schema": "./src/generators/remote/schema.json",
       "x-type": "application",
-      "description": "Generate a Remote Angular Module Federation Application."
+      "description": "Generate a Remote Angular Module Federation Application.",
+      "aliases": ["producer"]
     },
     "move": {
       "factory": "./src/generators/move/move#angularMoveGenerator",
@@ -91,7 +92,8 @@
       "factory": "./src/generators/host/host",
       "schema": "./src/generators/host/schema.json",
       "x-type": "application",
-      "description": "Generate a Host Angular Module Federation Application."
+      "description": "Generate a Host Angular Module Federation Application.",
+      "aliases": ["consumer"]
     },
     "ng-add": {
       "factory": "./src/generators/ng-add/ng-add",

package/migrations.json

@@ -314,6 +314,24 @@
       },
       "description": "Disable the Angular ESLint prefer-standalone rule if not set.",
       "factory": "./src/migrations/update-20-2-0/disable-angular-eslint-prefer-standalone"
+    },
+    "remove-angular-eslint-rules": {
+      "cli": "nx",
+      "version": "20.2.0-beta.8",
+      "requires": {
+        "@angular/core": ">=19.0.0"
+      },
+      "description": "Remove Angular ESLint rules that were removed in v19.0.0.",
+      "factory": "./src/migrations/update-20-2-0/remove-angular-eslint-rules"
+    },
+    "remove-tailwind-config-from-ng-packagr-executors": {
+      "cli": "nx",
+      "version": "20.2.0-beta.8",
+      "requires": {
+        "@angular/core": ">=19.0.0"
+      },
+      "description": "Remove the deprecated 'tailwindConfig' option from ng-packagr executors. Tailwind CSS configurations located at the project or workspace root will be picked up automatically.",
+      "factory": "./src/migrations/update-20-2-0/remove-tailwind-config-from-ng-packagr-executors"
     }
   },
   "packageJsonUpdates": {
@@ -1293,19 +1311,6 @@
         }
       }
     },
-    "20.2.0-analog": {
-      "version": "20.2.0-beta.5",
-      "packages": {
-        "@analogjs/vitest-angular": {
-          "version": "~1.10.0-beta.6",
-          "alwaysAddToPackageJson": false
-        },
-        "@analogjs/vite-plugin-angular": {
-          "version": "~1.10.0-beta.6",
-          "alwaysAddToPackageJson": false
-        }
-      }
-    },
     "20.2.0-jest": {
       "version": "20.2.0-beta.5",
       "requires": {
@@ -1350,6 +1355,19 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "20.2.0-analog": {
+      "version": "20.2.0-beta.7",
+      "packages": {
+        "@analogjs/vitest-angular": {
+          "version": "~1.10.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@analogjs/vite-plugin-angular": {
+          "version": "~1.10.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/angular",
-  "version": "20.2.0-canary.20241204-75b2080",
+  "version": "20.2.0-rc.0",
   "private": false,
   "description": "The Nx Plugin for Angular contains executors, generators, and utilities for managing Angular applications and libraries within an Nx workspace. It provides: \n\n- Integration with libraries such as Storybook, Jest, ESLint, Tailwind CSS, Playwright and Cypress. \n\n- Generators to help scaffold code quickly (like: Micro Frontends, Libraries, both internal to your codebase and publishable to npm) \n\n- Single Component Application Modules (SCAMs) \n\n- NgRx helpers. \n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -71,13 +71,13 @@
     "semver": "^7.5.3",
     "tslib": "^2.3.0",
     "webpack-merge": "^5.8.0",
-    "@nx/devkit": "20.2.0-canary.20241204-75b2080",
-    "@nx/js": "20.2.0-canary.20241204-75b2080",
-    "@nx/eslint": "20.2.0-canary.20241204-75b2080",
-    "@nx/webpack": "20.2.0-canary.20241204-75b2080",
-    "@nx/module-federation": "20.2.0-canary.20241204-75b2080",
-    "@nx/web": "20.2.0-canary.20241204-75b2080",
-    "@nx/workspace": "20.2.0-canary.20241204-75b2080",
+    "@nx/devkit": "20.2.0-rc.0",
+    "@nx/js": "20.2.0-rc.0",
+    "@nx/eslint": "20.2.0-rc.0",
+    "@nx/webpack": "20.2.0-rc.0",
+    "@nx/module-federation": "20.2.0-rc.0",
+    "@nx/web": "20.2.0-rc.0",
+    "@nx/workspace": "20.2.0-rc.0",
     "piscina": "^4.4.0"
   },
   "peerDependencies": {

package/src/generators/federate-module/schema.json

@@ -3,11 +3,15 @@
   "cli": "nx",
   "$id": "NxReactFederateModule",
   "title": "Federate Module",
-  "description": "Create a federated module, which is exposed by a remote and can be subsequently loaded by a host.",
+  "description": "Create a federated module, which is exposed by a Producer (remote) and can be subsequently loaded by a Consumer (host).",
   "examples": [
     {
-      "command": "nx g federate-module MyModule --path=./src/component/my-cmp.ts --remote=my-remote-app --remoteDirectory=apps/my-remote-app",
+      "command": "nx g federate-module MyModule --path=./src/component/my-cmp.ts --remote=myRemoteApp --remoteDirectory=apps/myRemoteApp",
       "description": "Create a federated module from my-remote-app, that exposes my-cmp from ./src/component/my-cmp.ts as MyModule."
+    },
+    {
+      "command": "nx g federate-module MyModule --path=./src/component/my-cmp.ts --producer=myProducer --producerDirectory=apps/myProducer",
+      "description": "Create a federated module from myProducer, that exposes my-cmp from ./src/component/my-cmp.ts as MyModule."
     }
   ],
   "type": "object",
@@ -30,15 +34,17 @@
     },
     "remote": {
       "type": "string",
-      "description": "The name of the remote.",
-      "x-prompt": "What is/should the remote be named?"
+      "description": "The name of the Producer (remote).",
+      "x-prompt": "What is/should the Producer (remote) be named?",
+      "alias": "producer"
     },
     "remoteDirectory": {
-      "description": "The directory of the new remote application if one needs to be created.",
-      "type": "string"
+      "description": "The directory of the new Producer (remote) application if one needs to be created.",
+      "type": "string",
+      "alias": "producerDirectory"
     },
     "style": {
-      "description": "The file extension to be used for style files for the remote if one needs to be created.",
+      "description": "The file extension to be used for style files for the Producer (remote) if one needs to be created.",
       "type": "string",
       "default": "css",
       "enum": ["css", "scss", "sass", "less"]
@@ -52,24 +58,25 @@
     "unitTestRunner": {
       "type": "string",
       "enum": ["jest", "vitest", "none"],
-      "description": "Test runner to use for unit tests of the remote if it needs to be created.",
+      "description": "Test runner to use for unit tests of the Producer (remote) if it needs to be created.",
       "x-prompt": "Which unit test runner would you like to use?",
       "default": "jest"
     },
     "e2eTestRunner": {
       "type": "string",
       "enum": ["cypress", "none"],
-      "description": "Test runner to use for end to end (e2e) tests of the remote if it needs to be created.",
+      "description": "Test runner to use for end to end (e2e) tests of the Producer (remote) if it needs to be created.",
       "default": "cypress"
     },
     "standalone": {
-      "description": "Whether to generate the remote application with standalone components if it needs to be created.",
+      "description": "Whether to generate the Producer (remote) application with standalone components if it needs to be created.",
       "type": "boolean",
       "default": true
     },
     "host": {
       "type": "string",
-      "description": "The host / shell application for this remote."
+      "description": "The Consumer (host) application for this Producer (remote).",
+      "alias": "consumer"
     }
   },
   "required": ["name", "path", "remote"],

package/src/generators/host/schema.json

@@ -2,13 +2,17 @@
   "$schema": "https://json-schema.org/schema",
   "$id": "NxMFHost",
   "cli": "nx",
-  "title": "Nx Module Federation Host Application",
-  "description": "Create an Angular Host Module Federation Application.",
+  "title": "Nx Module Federation Consumer (Host) Application",
+  "description": "Create an Angular Consumer (Host) Module Federation Application.",
   "type": "object",
   "examples": [
     {
       "command": "nx g @nx/angular:host appName --remotes=remote1",
-      "description": "Create an Angular application with configuration in place for Module Federation. If the `remotes` option is provided, attach the remote application to this application's configuration"
+      "description": "Create an Angular application with configuration in place for Module Federation. If the `remotes` option is provided, attach the Producer (remote) application to this application's configuration"
+    },
+    {
+      "command": "nx g @nx/angular:consumer appName --producers=remote1",
+      "description": "Create an Angular application with configuration in place for Module Federation. If the `producers` option is provided, attach the Producer (remote) application to this application's configuration"
     }
   ],
   "properties": {
@@ -23,14 +27,15 @@
     },
     "name": {
       "type": "string",
-      "description": "The name to give to the host Angular application.",
+      "description": "The name to give to the Consumer (host) Angular application.",
       "pattern": "^[a-zA-Z][^:]*$",
       "x-priority": "important"
     },
     "remotes": {
       "type": "array",
-      "description": "The names of the remote applications to add to the host.",
-      "x-priority": "important"
+      "description": "The names of the Producers (remote) applications to add to the Consumer (host).",
+      "x-priority": "important",
+      "alias": "producers"
     },
     "dynamic": {
       "type": "boolean",
@@ -163,11 +168,11 @@
     },
     "standalone": {
       "type": "boolean",
-      "description": "Whether to generate a host application that uses standalone components.",
+      "description": "Whether to generate a Consumer (host) application that uses standalone components.",
       "default": true
     },
     "ssr": {
-      "description": "Whether to configure SSR for the host application",
+      "description": "Whether to configure SSR for the Consumer (host) application",
       "type": "boolean",
       "default": false,
       "x-priority": "important"

package/src/generators/remote/schema.json

@@ -2,13 +2,17 @@
   "$schema": "https://json-schema.org/schema",
   "$id": "NxMFRemote",
   "cli": "nx",
-  "title": "Nx Module Federation Remote App",
-  "description": "Create an Angular Remote Module Federation Application.",
+  "title": "Nx Module Federation Producer (Remote) App",
+  "description": "Create an Angular Producer (Remote) Module Federation Application.",
   "type": "object",
   "examples": [
     {
       "command": "nx g @nx/angular:remote appName --host=host --port=4201",
-      "description": "Create an Angular app with configuration in place for Module Federation. If host is provided, attach this remote app to host app's configuration."
+      "description": "Create an Angular app with configuration in place for Module Federation. If Consumer (host) is provided, attach this Producer (remote) app to Consumer (host) app's configuration."
+    },
+    {
+      "command": "nx g @nx/angular:producer appName --consumer=host --port=4201",
+      "description": "Create an Angular app with configuration in place for Module Federation. If Consumer (host) is provided, attach this Producer (remote) app to Consumer (host) app's configuration."
     }
   ],
   "properties": {
@@ -23,15 +27,16 @@
     },
     "name": {
       "type": "string",
-      "description": "The name to give to the remote Angular app.",
+      "description": "The name to give to the Producer (remote) Angular app.",
       "pattern": "^[a-zA-Z_$][a-zA-Z_$0-9]*$",
       "x-priority": "important"
     },
     "host": {
       "type": "string",
-      "description": "The name of the host app to attach this remote app to.",
+      "description": "The name of the Consumer (host) app to attach this Producer (remote) app to.",
       "x-dropdown": "projects",
-      "x-priority": "important"
+      "x-priority": "important",
+      "alias": "consumer"
     },
     "port": {
       "type": "number",
@@ -156,12 +161,12 @@
       "x-priority": "internal"
     },
     "standalone": {
-      "description": "Whether to generate a remote application with standalone components.",
+      "description": "Whether to generate a Producer (remote) application with standalone components.",
       "type": "boolean",
       "default": true
     },
     "ssr": {
-      "description": "Whether to configure SSR for the remote application to be consumed by a host application using SSR.",
+      "description": "Whether to configure SSR for the Producer (remote) application to be consumed by a Consumer (host) application using SSR.",
       "type": "boolean",
       "default": false
     },

package/src/generators/setup-mf/schema.json

@@ -34,15 +34,17 @@
     },
     "remotes": {
       "type": "array",
-      "description": "A list of remote application names that the host application should consume."
+      "description": "A list of remote application names that the Consumer (host) application should consume.",
+      "alias": "producers"
     },
     "host": {
       "type": "string",
-      "description": "The name of the host application that the remote application will be consumed by."
+      "description": "The name of the host application that the remote application will be consumed by.",
+      "alias": "consumer"
     },
     "routing": {
       "type": "boolean",
-      "description": "Generate a routing setup to allow a host application to route to the remote application.",
+      "description": "Generate a routing setup to allow a Consumer (host) application to route to the Producer (remote) application.",
       "x-priority": "important"
     },
     "skipFormat": {

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

@@ -0,0 +1,2 @@
+import { type Tree } from '@nx/devkit';
+export default function (tree: Tree): Promise<void>;

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

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = default_1;
+const devkit_1 = require("@nx/devkit");
+const eslint_file_1 = require("@nx/eslint/src/generators/utils/eslint-file");
+const projects_1 = require("../utils/projects");
+async function default_1(tree) {
+    const projects = await (0, projects_1.getProjectsFilteredByDependencies)(tree, [
+        'npm:@angular/core',
+    ]);
+    for (const { project: { root }, } of projects) {
+        if (!(0, eslint_file_1.isEslintConfigSupported)(tree, root)) {
+            // ESLint config is not supported, skip
+            continue;
+        }
+        removeRule(tree, root, '@angular-eslint/no-host-metadata-property');
+        removeRule(tree, root, '@angular-eslint/sort-ngmodule-metadata-arrays');
+        removeRule(tree, root, '@angular-eslint/prefer-standalone-component');
+    }
+    await (0, devkit_1.formatFiles)(tree);
+}
+function removeRule(tree, root, rule) {
+    const lookup = (o) => !!o.rules?.[rule];
+    if (!(0, eslint_file_1.lintConfigHasOverride)(tree, root, lookup, true)) {
+        // it's not using the rule, skip
+        return;
+    }
+    // there is an override containing the rule, remove the rule
+    (0, eslint_file_1.updateOverrideInLintConfig)(tree, root, lookup, (o) => {
+        delete o.rules[rule];
+        return o;
+    });
+}

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

@@ -0,0 +1,3 @@
+import { type Tree } from '@nx/devkit';
+export declare const executors: string[];
+export default function (tree: Tree): Promise<void>;

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

@@ -0,0 +1,73 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.executors = void 0;
+exports.default = default_1;
+const devkit_1 = require("@nx/devkit");
+const executor_options_utils_1 = require("@nx/devkit/src/generators/executor-options-utils");
+exports.executors = ['@nx/angular:ng-packagr-lite', '@nx/angular:package'];
+async function default_1(tree) {
+    // update options from project configs
+    exports.executors.forEach((executor) => {
+        (0, executor_options_utils_1.forEachExecutorOptions)(tree, executor, (options, project, target, configuration) => {
+            if (options.tailwindConfig === undefined) {
+                return;
+            }
+            const projectConfiguration = (0, devkit_1.readProjectConfiguration)(tree, project);
+            if (configuration) {
+                const config = projectConfiguration.targets[target].configurations[configuration];
+                delete config.tailwindConfig;
+                if (!Object.keys(config).length) {
+                    delete projectConfiguration.targets[target].configurations[configuration];
+                }
+                if (!Object.keys(projectConfiguration.targets[target].configurations)
+                    .length) {
+                    delete projectConfiguration.targets[target].configurations;
+                }
+            }
+            else {
+                const config = projectConfiguration.targets[target].options;
+                delete config.tailwindConfig;
+                if (!Object.keys(config).length) {
+                    delete projectConfiguration.targets[target].options;
+                }
+            }
+            (0, devkit_1.updateProjectConfiguration)(tree, project, projectConfiguration);
+        });
+    });
+    // update options from nx.json target defaults
+    const nxJson = (0, devkit_1.readNxJson)(tree);
+    if (!nxJson.targetDefaults) {
+        return;
+    }
+    for (const [targetOrExecutor, targetConfig] of Object.entries(nxJson.targetDefaults)) {
+        if (!exports.executors.includes(targetOrExecutor) &&
+            !exports.executors.includes(targetConfig.executor)) {
+            continue;
+        }
+        if (targetConfig.options) {
+            delete targetConfig.options.tailwindConfig;
+            if (!Object.keys(targetConfig.options).length) {
+                delete targetConfig.options;
+            }
+        }
+        Object.entries(targetConfig.configurations ?? {}).forEach(([name, config]) => {
+            delete config.tailwindConfig;
+            if (!Object.keys(config).length) {
+                delete targetConfig.configurations[name];
+            }
+        });
+        if (!Object.keys(targetConfig.configurations ?? {}).length) {
+            delete targetConfig.configurations;
+        }
+        if (!Object.keys(targetConfig).length ||
+            (Object.keys(targetConfig).length === 1 &&
+                Object.keys(targetConfig)[0] === 'executor')) {
+            delete nxJson.targetDefaults[targetOrExecutor];
+        }
+        if (!Object.keys(nxJson.targetDefaults).length) {
+            delete nxJson.targetDefaults;
+        }
+    }
+    (0, devkit_1.updateNxJson)(tree, nxJson);
+    await (0, devkit_1.formatFiles)(tree);
+}

package/src/utils/versions.d.ts

@@ -24,5 +24,5 @@ export declare const tsNodeVersion = "10.9.1";
 export declare const jestPresetAngularVersion = "~14.4.0";
 export declare const typesNodeVersion = "18.16.9";
 export declare const jasmineMarblesVersion = "^0.9.2";
-export declare const analogVitestAngular = "~1.10.0-beta.6";
+export declare const analogVitestAngular = "~1.10.0";
 export declare const jsoncEslintParserVersion = "^2.1.0";

package/src/utils/versions.js

@@ -27,5 +27,5 @@ exports.tsNodeVersion = '10.9.1';
 exports.jestPresetAngularVersion = '~14.4.0';
 exports.typesNodeVersion = '18.16.9';
 exports.jasmineMarblesVersion = '^0.9.2';
-exports.analogVitestAngular = '~1.10.0-beta.6';
+exports.analogVitestAngular = '~1.10.0';
 exports.jsoncEslintParserVersion = '^2.1.0';