@nx/angular 19.6.0-canary.20240814-6d83ae2 → 19.6.0-rc.0

package/executors.d.ts

@@ -1,4 +1,3 @@
-export * from './src/builders/module-federation-dev-ssr/module-federation-dev-ssr.impl';
 export * from './src/builders/webpack-browser/webpack-browser.impl';
 export * from './src/builders/webpack-server/webpack-server.impl';
 export * from './src/executors/module-federation-dev-server/module-federation-dev-server.impl';
@@ -8,6 +7,7 @@ export * from './src/executors/package/package.impl';
 export * from './src/executors/browser-esbuild/browser-esbuild.impl';
 export * from './src/executors/application/application.impl';
 export * from './src/executors/extract-i18n/extract-i18n.impl';
+export * from './src/executors/module-federation-ssr-dev-server/module-federation-ssr-dev-server.impl';
 import { executeDevServerBuilder } from './src/builders/dev-server/dev-server.impl';
 export { 
 /**

package/executors.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.executeDevServerBuilder = exports.executeWebpackDevServerBuilder = void 0;
 const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./src/builders/module-federation-dev-ssr/module-federation-dev-ssr.impl"), exports);
 tslib_1.__exportStar(require("./src/builders/webpack-browser/webpack-browser.impl"), exports);
 tslib_1.__exportStar(require("./src/builders/webpack-server/webpack-server.impl"), exports);
 tslib_1.__exportStar(require("./src/executors/module-federation-dev-server/module-federation-dev-server.impl"), exports);
@@ -12,6 +11,7 @@ tslib_1.__exportStar(require("./src/executors/package/package.impl"), exports);
 tslib_1.__exportStar(require("./src/executors/browser-esbuild/browser-esbuild.impl"), exports);
 tslib_1.__exportStar(require("./src/executors/application/application.impl"), exports);
 tslib_1.__exportStar(require("./src/executors/extract-i18n/extract-i18n.impl"), exports);
+tslib_1.__exportStar(require("./src/executors/module-federation-ssr-dev-server/module-federation-ssr-dev-server.impl"), exports);
 const dev_server_impl_1 = require("./src/builders/dev-server/dev-server.impl");
 Object.defineProperty(exports, "executeWebpackDevServerBuilder", { enumerable: true, get: function () { return dev_server_impl_1.executeDevServerBuilder; } });
 Object.defineProperty(exports, "executeDevServerBuilder", { enumerable: true, get: function () { return dev_server_impl_1.executeDevServerBuilder; } });

package/executors.json

@@ -25,6 +25,11 @@
       "schema": "./src/executors/module-federation-dev-server/schema.json",
       "description": "Serves host [Module Federation](https://module-federation.io/) applications ([webpack](https://webpack.js.org/)-based) allowing to specify which remote applications should be served with the host."
     },
+    "module-federation-dev-ssr": {
+      "implementation": "./src/executors/module-federation-ssr-dev-server/module-federation-ssr-dev-server.impl",
+      "schema": "./src/executors/module-federation-ssr-dev-server/schema.json",
+      "description": "The module-federation-ssr-dev-server executor is reserved exclusively for use with host SSR Module Federation applications. It allows the user to specify which remote applications should be served with the host."
+    },
     "application": {
       "implementation": "./src/executors/application/application.impl",
       "schema": "./src/executors/application/schema.json",
@@ -51,11 +56,6 @@
       "implementation": "./src/builders/webpack-server/webpack-server.impl",
       "schema": "./src/builders/webpack-server/schema.json",
       "description": "Builds a server Angular application using [webpack](https://webpack.js.org/). This executor is a drop-in replacement for the `@angular-devkit/build-angular:server` builder provided by the Angular CLI. It is usually used in tandem with the `@nx/angular:webpack-browser` executor when your Angular application uses a custom webpack configuration."
-    },
-    "module-federation-dev-ssr": {
-      "implementation": "./src/builders/module-federation-dev-ssr/module-federation-dev-ssr.impl",
-      "schema": "./src/builders/module-federation-dev-ssr/schema.json",
-      "description": "Serves host [Module Federation](https://module-federation.io/) applications ([webpack](https://webpack.js.org/)-based) that use SSR allowing to specify which remote applications should be served with the host."
     }
   }
 }

package/migrations.json

@@ -413,6 +413,21 @@
       },
       "description": "Update the @angular/cli package version to ~18.1.0.",
       "factory": "./src/migrations/update-19-5-0/update-angular-cli"
+    },
+    "update-19-6-0": {
+      "cli": "nx",
+      "version": "19.6.0-beta.4",
+      "description": "Ensure Module Federation DTS is turned off by default.",
+      "factory": "./src/migrations/update-19-6-0/turn-off-dts-by-default"
+    },
+    "update-angular-cli-version-18-2-0": {
+      "cli": "nx",
+      "version": "19.6.0-beta.7",
+      "requires": {
+        "@angular/core": ">=18.2.0"
+      },
+      "description": "Update the @angular/cli package version to ~18.2.0.",
+      "factory": "./src/migrations/update-19-6-0/update-angular-cli"
     }
   },
   "packageJsonUpdates": {
@@ -2028,6 +2043,67 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "19.6.0": {
+      "version": "19.6.0-beta.7",
+      "x-prompt": "Do you want to update the Angular version to v18.2?",
+      "requires": {
+        "@angular/core": ">=18.1.0 <18.2.0"
+      },
+      "packages": {
+        "@angular-devkit/build-angular": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/core": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/schematics": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/build": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/pwa": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/ssr": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@schematics/angular": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/architect": {
+          "version": "~0.1802.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/build-webpack": {
+          "version": "~0.1802.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/core": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": true
+        },
+        "@angular/material": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/cdk": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        },
+        "ng-packagr": {
+          "version": "~18.2.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/angular",
-  "version": "19.6.0-canary.20240814-6d83ae2",
+  "version": "19.6.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": {
@@ -79,14 +79,14 @@
     "webpack-merge": "^5.8.0",
     "webpack": "^5.88.0",
     "@module-federation/enhanced": "~0.2.3",
-    "@nx/devkit": "19.6.0-canary.20240814-6d83ae2",
-    "@nx/js": "19.6.0-canary.20240814-6d83ae2",
-    "@nx/eslint": "19.6.0-canary.20240814-6d83ae2",
-    "@nx/webpack": "19.6.0-canary.20240814-6d83ae2",
-    "@nx/web": "19.6.0-canary.20240814-6d83ae2",
-    "@nx/workspace": "19.6.0-canary.20240814-6d83ae2",
+    "@nx/devkit": "19.6.0-rc.0",
+    "@nx/js": "19.6.0-rc.0",
+    "@nx/eslint": "19.6.0-rc.0",
+    "@nx/webpack": "19.6.0-rc.0",
+    "@nx/web": "19.6.0-rc.0",
+    "@nx/workspace": "19.6.0-rc.0",
     "piscina": "^4.4.0",
-    "@nrwl/angular": "19.6.0-canary.20240814-6d83ae2"
+    "@nrwl/angular": "19.6.0-rc.0"
   },
   "peerDependencies": {
     "@angular-devkit/build-angular": ">= 16.0.0 < 19.0.0",

package/src/executors/module-federation-ssr-dev-server/lib/build-static-remotes.d.ts

@@ -0,0 +1,4 @@
+import type { Schema } from '../schema';
+import { type ExecutorContext } from '@nx/devkit';
+import type { StaticRemotesConfig } from '@nx/webpack/src/utils/module-federation/parse-static-remotes-config';
+export declare function buildStaticRemotes(staticRemotesConfig: StaticRemotesConfig, nxBin: any, context: ExecutorContext, options: Schema): Promise<Record<string, string>>;

package/src/executors/module-federation-ssr-dev-server/lib/build-static-remotes.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildStaticRemotes = buildStaticRemotes;
+const devkit_1 = require("@nx/devkit");
+const cache_directory_1 = require("nx/src/utils/cache-directory");
+const node_child_process_1 = require("node:child_process");
+const node_path_1 = require("node:path");
+const node_fs_1 = require("node:fs");
+async function buildStaticRemotes(staticRemotesConfig, nxBin, context, options) {
+    if (!staticRemotesConfig.remotes.length) {
+        return;
+    }
+    const mappedLocationOfRemotes = {};
+    for (const app of staticRemotesConfig.remotes) {
+        mappedLocationOfRemotes[app] = `http${options.ssl ? 's' : ''}://${options.host}:${options.staticRemotesPort}/${staticRemotesConfig.config[app].urlSegment}`;
+    }
+    await new Promise((resolve, reject) => {
+        devkit_1.logger.info(`NX Building ${staticRemotesConfig.remotes.length} static remotes...`);
+        const staticProcess = (0, node_child_process_1.fork)(nxBin, [
+            'run-many',
+            `--target=server`,
+            `--projects=${staticRemotesConfig.remotes.join(',')}`,
+            ...(context.configurationName
+                ? [`--configuration=${context.configurationName}`]
+                : []),
+            ...(options.parallel ? [`--parallel=${options.parallel}`] : []),
+        ], {
+            cwd: context.root,
+            stdio: ['ignore', 'pipe', 'pipe', 'ipc'],
+        });
+        // File to debug build failures e.g. 2024-01-01T00_00_0_0Z-build.log'
+        const remoteBuildLogFile = (0, node_path_1.join)(cache_directory_1.workspaceDataDirectory, `${new Date().toISOString().replace(/[:\.]/g, '_')}-build.log`);
+        const stdoutStream = (0, node_fs_1.createWriteStream)(remoteBuildLogFile);
+        staticProcess.stdout.on('data', (data) => {
+            const ANSII_CODE_REGEX = /[\u001b\u009b][[()#;?]*(?:[0-9]{1,4}(?:;[0-9]{0,4})*)?[0-9A-ORZcf-nqry=><]/g;
+            const stdoutString = data.toString().replace(ANSII_CODE_REGEX, '');
+            stdoutStream.write(stdoutString);
+            // in addition to writing into the stdout stream, also show error directly in console
+            // so the error is easily discoverable. 'ERROR in' is the key word to search in webpack output.
+            if (stdoutString.includes('ERROR in')) {
+                devkit_1.logger.log(stdoutString);
+            }
+            if (stdoutString.includes('Successfully ran target server')) {
+                staticProcess.stdout.removeAllListeners('data');
+                devkit_1.logger.info(`NX Built ${staticRemotesConfig.remotes.length} static remotes`);
+                resolve();
+            }
+        });
+        staticProcess.stderr.on('data', (data) => devkit_1.logger.info(data.toString()));
+        staticProcess.once('exit', (code) => {
+            stdoutStream.end();
+            staticProcess.stdout.removeAllListeners('data');
+            staticProcess.stderr.removeAllListeners('data');
+            if (code !== 0) {
+                reject(`Remote failed to start. A complete log can be found in: ${remoteBuildLogFile}`);
+            }
+            else {
+                resolve();
+            }
+        });
+        process.on('SIGTERM', () => staticProcess.kill('SIGTERM'));
+        process.on('exit', () => staticProcess.kill('SIGTERM'));
+    });
+    return mappedLocationOfRemotes;
+}

package/src/executors/module-federation-ssr-dev-server/lib/normalize-options.d.ts

@@ -0,0 +1,2 @@
+import type { Schema } from '../schema';
+export declare function normalizeOptions(options: Schema): Schema;

package/src/executors/module-federation-ssr-dev-server/lib/normalize-options.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.normalizeOptions = normalizeOptions;
+const devkit_1 = require("@nx/devkit");
+const path_1 = require("path");
+function normalizeOptions(options) {
+    const devServeRemotes = !options.devRemotes
+        ? []
+        : Array.isArray(options.devRemotes)
+            ? options.devRemotes
+            : [options.devRemotes];
+    return {
+        ...options,
+        devRemotes: devServeRemotes,
+        ssl: options.ssl ?? false,
+        sslCert: options.sslCert ? (0, path_1.join)(devkit_1.workspaceRoot, options.sslCert) : undefined,
+        sslKey: options.sslKey ? (0, path_1.join)(devkit_1.workspaceRoot, options.sslKey) : undefined,
+    };
+}

package/src/executors/module-federation-ssr-dev-server/lib/start-dev-remotes.d.ts

@@ -0,0 +1,5 @@
+import { type Schema } from '../schema';
+import { type ExecutorContext, type ProjectConfiguration } from '@nx/devkit';
+export declare function startRemotes(remotes: string[], workspaceProjects: Record<string, ProjectConfiguration>, options: Schema, context: ExecutorContext): Promise<AsyncIterable<{
+    success: boolean;
+}>[]>;

package/src/executors/module-federation-ssr-dev-server/lib/start-dev-remotes.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.startRemotes = startRemotes;
+const devkit_1 = require("@nx/devkit");
+async function startRemotes(remotes, workspaceProjects, options, context) {
+    const target = 'serve-ssr';
+    const remoteIters = [];
+    for (const app of remotes) {
+        if (!workspaceProjects[app].targets?.[target]) {
+            throw new Error(`Could not find "${target}" target in "${app}" project.`);
+        }
+        else if (!workspaceProjects[app].targets?.[target].executor) {
+            throw new Error(`Could not find executor for "${target}" target in "${app}" project.`);
+        }
+        const [_, executor] = workspaceProjects[app].targets[target].executor.split(':');
+        const isUsingModuleFederationSsrDevServerExecutor = executor.includes('module-federation-dev-ssr');
+        const configurationOverride = options.devRemotes.find((r) => typeof r !== 'string' && r.remoteName === app)?.configuration;
+        remoteIters.push(await (0, devkit_1.runExecutor)({
+            project: app,
+            target,
+            configuration: configurationOverride ?? context.configurationName,
+        }, {
+            ...{ verbose: options.verbose ?? false },
+            ...(isUsingModuleFederationSsrDevServerExecutor
+                ? { isInitialHost: false }
+                : {}),
+        }, context));
+    }
+    return remoteIters;
+}

package/src/executors/module-federation-ssr-dev-server/lib/start-static-remotes.d.ts

@@ -0,0 +1,9 @@
+import { type ExecutorContext } from '@nx/devkit';
+import { type Schema } from '../schema';
+import type { StaticRemotesConfig } from '@nx/webpack/src/utils/module-federation/parse-static-remotes-config';
+export declare function startStaticRemotes(ssrStaticRemotesConfig: StaticRemotesConfig, context: ExecutorContext, options: Schema): AsyncGenerator<{
+    success: boolean;
+    baseUrl: string;
+}, {
+    success: boolean;
+}, unknown>;

package/src/executors/module-federation-ssr-dev-server/lib/start-static-remotes.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.startStaticRemotes = startStaticRemotes;
+const tslib_1 = require("tslib");
+const devkit_1 = require("@nx/devkit");
+const file_server_impl_1 = tslib_1.__importDefault(require("@nx/web/src/executors/file-server/file-server.impl"));
+const path_1 = require("path");
+const fs_1 = require("fs");
+function startStaticRemotes(ssrStaticRemotesConfig, context, options) {
+    if (ssrStaticRemotesConfig.remotes.length === 0) {
+        return;
+    }
+    // The directories are usually generated with /browser and /server suffixes so we need to copy them to a common directory
+    const commonOutputDirectory = (0, path_1.join)(devkit_1.workspaceRoot, 'tmp/static-remotes');
+    for (const app of ssrStaticRemotesConfig.remotes) {
+        const remoteConfig = ssrStaticRemotesConfig.config[app];
+        (0, fs_1.cpSync)(remoteConfig.outputPath, (0, path_1.join)(commonOutputDirectory, remoteConfig.urlSegment), {
+            force: true,
+            recursive: true,
+        });
+    }
+    const staticRemotesIter = (0, file_server_impl_1.default)({
+        cors: true,
+        watch: false,
+        staticFilePath: commonOutputDirectory,
+        parallel: false,
+        spa: false,
+        withDeps: false,
+        host: options.host,
+        port: options.staticRemotesPort,
+        ssl: options.ssl,
+        sslCert: options.sslCert,
+        sslKey: options.sslKey,
+        cacheSeconds: -1,
+    }, context);
+    return staticRemotesIter;
+}

package/src/executors/module-federation-ssr-dev-server/module-federation-ssr-dev-server.impl.d.ts

@@ -0,0 +1,4 @@
+import { type ExecutorContext } from '@nx/devkit';
+import type { Schema } from './schema';
+export declare function moduleFederationSsrDevServerExecutor(schema: Schema, context: ExecutorContext): AsyncGenerator<any, any, undefined>;
+export default moduleFederationSsrDevServerExecutor;

package/src/executors/module-federation-ssr-dev-server/module-federation-ssr-dev-server.impl.js

@@ -0,0 +1,101 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.moduleFederationSsrDevServerExecutor = moduleFederationSsrDevServerExecutor;
+const devkit_1 = require("@nx/devkit");
+const fs_1 = require("fs");
+const project_graph_1 = require("nx/src/project-graph/project-graph");
+const path_1 = require("path");
+const module_federation_1 = require("../../builders/utilities/module-federation");
+const module_federation_2 = require("@nx/webpack/src/utils/module-federation");
+const parse_static_remotes_config_1 = require("@nx/webpack/src/utils/module-federation/parse-static-remotes-config");
+const build_static_remotes_1 = require("./lib/build-static-remotes");
+const start_dev_remotes_1 = require("./lib/start-dev-remotes");
+const start_static_remotes_1 = require("./lib/start-static-remotes");
+const async_iterable_1 = require("@nx/devkit/src/utils/async-iterable");
+const rxjs_for_await_1 = require("@nx/devkit/src/utils/rxjs-for-await");
+const ngcli_adapter_1 = require("nx/src/adapter/ngcli-adapter");
+const normalize_options_1 = require("./lib/normalize-options");
+const wait_for_port_open_1 = require("@nx/web/src/utils/wait-for-port-open");
+const start_ssr_remote_proxies_1 = require("@nx/webpack/src/utils/module-federation/start-ssr-remote-proxies");
+const dev_server_impl_1 = require("../../builders/dev-server/dev-server.impl");
+async function* moduleFederationSsrDevServerExecutor(schema, context) {
+    const nxBin = require.resolve('nx/bin/nx');
+    const options = (0, normalize_options_1.normalizeOptions)(schema);
+    const currIter = (0, rxjs_for_await_1.eachValueFrom)((0, dev_server_impl_1.executeDevServerBuilder)(options, await (0, ngcli_adapter_1.createBuilderContext)({
+        builderName: '@nx/angular:webpack-server',
+        description: 'Build a ssr application',
+        optionSchema: require('../../builders/webpack-server/schema.json'),
+    }, context)));
+    if (options.isInitialHost === false) {
+        return yield* currIter;
+    }
+    const { projects: workspaceProjects } = (0, project_graph_1.readProjectsConfigurationFromProjectGraph)(context.projectGraph);
+    const project = workspaceProjects[context.projectName];
+    let pathToManifestFile;
+    if (options.pathToManifestFile) {
+        const userPathToManifestFile = (0, path_1.join)(context.root, options.pathToManifestFile);
+        if (!(0, fs_1.existsSync)(userPathToManifestFile)) {
+            throw new Error(`The provided Module Federation manifest file path does not exist. Please check the file exists at "${userPathToManifestFile}".`);
+        }
+        else if ((0, path_1.extname)(options.pathToManifestFile) !== '.json') {
+            throw new Error(`The Module Federation manifest file must be a JSON. Please ensure the file at ${userPathToManifestFile} is a JSON.`);
+        }
+        pathToManifestFile = userPathToManifestFile;
+    }
+    else {
+        pathToManifestFile = (0, module_federation_1.getDynamicMfManifestFile)(project, context.root);
+    }
+    (0, module_federation_1.validateDevRemotes)({ devRemotes: options.devRemotes }, workspaceProjects);
+    const moduleFederationConfig = (0, module_federation_2.getModuleFederationConfig)(project.targets.build.options.tsConfig, context.root, project.root, 'angular');
+    const remoteNames = options.devRemotes.map((r) => typeof r === 'string' ? r : r.remoteName);
+    const remotes = (0, module_federation_2.getRemotes)(remoteNames, options.skipRemotes, moduleFederationConfig, {
+        projectName: project.name,
+        projectGraph: context.projectGraph,
+        root: context.root,
+    }, pathToManifestFile);
+    options.staticRemotesPort ??= remotes.staticRemotePort;
+    const staticRemotesConfig = (0, parse_static_remotes_config_1.parseStaticSsrRemotesConfig)([...remotes.staticRemotes, ...remotes.dynamicRemotes], context);
+    const mappedLocationsOfStaticRemotes = await (0, build_static_remotes_1.buildStaticRemotes)(staticRemotesConfig, nxBin, context, options);
+    // Set NX_MF_DEV_REMOTES for the Nx Runtime Library Control Plugin
+    process.env.NX_MF_DEV_REMOTES = JSON.stringify(options.devRemotes);
+    const devRemotes = await (0, start_dev_remotes_1.startRemotes)(remotes.devRemotes, workspaceProjects, options, context);
+    const staticRemotes = (0, start_static_remotes_1.startStaticRemotes)(staticRemotesConfig, context, options);
+    (0, start_ssr_remote_proxies_1.startSsrRemoteProxies)(staticRemotesConfig, mappedLocationsOfStaticRemotes, options.ssl
+        ? { pathToCert: options.sslCert, pathToKey: options.sslKey }
+        : undefined);
+    const removeBaseUrlEmission = (iter) => (0, async_iterable_1.mapAsyncIterable)(iter, (v) => ({
+        ...v,
+        baseUrl: undefined,
+    }));
+    return yield* (0, async_iterable_1.combineAsyncIterables)(removeBaseUrlEmission(currIter), ...devRemotes.map(removeBaseUrlEmission), ...(staticRemotes ? [removeBaseUrlEmission(staticRemotes)] : []), (0, async_iterable_1.createAsyncIterable)(async ({ next, done }) => {
+        if (!options.isInitialHost) {
+            done();
+            return;
+        }
+        if (remotes.remotePorts.length) {
+            devkit_1.logger.info(`Nx All remotes started, server ready at http://localhost:${options.port}`);
+            next({ success: true, baseUrl: `http://localhost:${options.port}` });
+            done();
+            return;
+        }
+        try {
+            const portsToWaitFor = staticRemotes
+                ? [options.staticRemotesPort, ...remotes.remotePorts]
+                : [...remotes.remotePorts];
+            await Promise.all(portsToWaitFor.map((port) => (0, wait_for_port_open_1.waitForPortOpen)(port, {
+                retries: 480,
+                retryDelay: 2500,
+                host: 'localhost',
+            })));
+        }
+        catch (error) {
+            throw new Error(`Failed to start remotes. Check above for any errors.`, {
+                cause: error,
+            });
+        }
+        finally {
+            done();
+        }
+    }));
+}
+exports.default = moduleFederationSsrDevServerExecutor;

package/src/{builders/module-federation-dev-ssr → executors/module-federation-ssr-dev-server}/schema.d.ts

@@ -1,3 +1,5 @@
+import { type DevRemoteDefinition } from '../../builders/utilities/module-federation';
+
 export interface Schema {
   browserTarget: string;
   serverTarget: string;
@@ -10,8 +12,12 @@ export interface Schema {
   sslKey?: string;
   sslCert?: string;
   proxyConfig?: string;
-  devRemotes?: string[];
+  devRemotes?: DevRemoteDefinition[];
   skipRemotes?: string[];
   verbose: boolean;
   pathToManifestFile?: string;
+  parallel?: number;
+  staticRemotesPort?: number;
+  parallel?: number;
+  isInitialHost?: boolean;
 }

package/src/{builders/module-federation-dev-ssr → executors/module-federation-ssr-dev-server}/schema.json

@@ -1,7 +1,8 @@
 {
   "$schema": "http://json-schema.org/draft-07/schema",
   "title": "Module Federation SSR Dev Server Target",
-  "description": "Serves host [Module Federation](https://module-federation.io/) applications ([webpack](https://webpack.js.org/)-based) that use SSR allowing to specify which remote applications should be served with the host.",
+  "outputCapture": "direct-nodejs",
+  "description": "The module-federation-ssr-dev-server executor is reserved exclusively for use with host SSR Module Federation applications. It allows the user to specify which remote applications should be served with the host.",
   "type": "object",
   "properties": {
     "browserTarget": {
@@ -63,7 +64,24 @@
     "devRemotes": {
       "type": "array",
       "items": {
-        "type": "string"
+        "oneOf": [
+          {
+            "type": "string"
+          },
+          {
+            "type": "object",
+            "properties": {
+              "remoteName": {
+                "type": "string"
+              },
+              "configuration": {
+                "type": "string"
+              }
+            },
+            "required": ["remoteName"],
+            "additionalProperties": false
+          }
+        ]
       },
       "description": "List of remote applications to run in development mode (i.e. using serve target).",
       "x-priority": "important"
@@ -83,6 +101,20 @@
     "pathToManifestFile": {
       "type": "string",
       "description": "Path to a Module Federation manifest file (e.g. `my/path/to/module-federation.manifest.json`) containing the dynamic remote applications relative to the workspace root."
+    },
+    "isInitialHost": {
+      "type": "boolean",
+      "description": "Whether the host that is running this executor is the first in the project tree to do so.",
+      "default": true,
+      "x-priority": "internal"
+    },
+    "parallel": {
+      "type": "number",
+      "description": "Max number of parallel processes for building static remotes"
+    },
+    "staticRemotesPort": {
+      "type": "number",
+      "description": "The port at which to serve the file-server for the static remotes."
     }
   },
   "additionalProperties": false,

package/src/executors/utilities/esbuild-extensions.d.ts

@@ -1,4 +1,4 @@
-import type { Plugin } from 'esbuild';
+type Plugin = Parameters<typeof import('@angular-devkit/build-angular').buildApplication>[2]['codePlugins'][number];
 export type PluginSpec = {
     path: string;
     options: any;
@@ -6,3 +6,4 @@ export type PluginSpec = {
 export declare function loadPlugins(plugins: string[] | PluginSpec[] | undefined, tsConfig: string): Promise<Plugin[]>;
 export declare function loadMiddleware(middlewareFns: string[] | undefined, tsConfig: string): Promise<any[]>;
 export declare function loadIndexHtmlTransformer(indexHtmlTransformerPath: string, tsConfig: string): Promise<any>;
+export {};

package/src/generators/component-cypress-spec/schema.json

@@ -3,7 +3,8 @@
   "$id": "NxAngularComponentCypressSpecGenerator",
   "type": "object",
   "cli": "nx",
-  "description": "Creates a Cypress spec for a UI component that has a story.",
+  "description": "Creates a Storybook Cypress spec for a UI component that has a story.",
+  "x-deprecated": "Use interactionTests instead. This option will be removed in v20.",
   "properties": {
     "projectName": {
       "type": "string",

package/src/generators/host/files/js/webpack.server.config.js__tmpl__

@@ -1,3 +1,8 @@
 const { withModuleFederationForSSR } = require('@nx/angular/module-federation');
 const config = require('./module-federation.config');
-module.exports = withModuleFederationForSSR(config)
+/**
+ * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support for Module Federation
+ * The DTS Plugin can be enabled by setting dts: true
+ * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
+ */
+module.exports = withModuleFederationForSSR(config, { dts: false });

package/src/generators/host/files/ts/webpack.server.config.ts__tmpl__

@@ -1,4 +1,9 @@
 import { withModuleFederationForSSR } from '@nx/angular/module-federation';
 import config from './module-federation.config';
 
-export default withModuleFederationForSSR(config);
+/**
+ * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support for Module Federation
+ * The DTS Plugin can be enabled by setting dts: true
+ * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
+ */
+export default withModuleFederationForSSR(config, { dts: false });

package/src/generators/remote/files/base/webpack.server.config.js__tmpl__

@@ -1,3 +1,9 @@
 const { withModuleFederationForSSR } = require('@nx/angular/module-federation');
 const config = require('./module-federation.config');
-module.exports = withModuleFederationForSSR(config)
+
+/**
+ * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support for Module Federation
+ * The DTS Plugin can be enabled by setting dts: true
+ * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
+ */
+module.exports = withModuleFederationForSSR(config, { dts: false })

package/src/generators/remote/files/base-ts/webpack.server.config.ts__tmpl__

@@ -1,4 +1,9 @@
 import { withModuleFederationForSSR } from '@nx/angular/module-federation';
 import config from './module-federation.config';
 
-export default withModuleFederationForSSR(config);
+/**
+ * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support for Module Federation
+ * The DTS Plugin can be enabled by setting dts: true
+ * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
+ */
+export default withModuleFederationForSSR(config, { dts: false });

package/src/generators/setup-mf/files/ts-webpack/webpack.config.ts__tmpl__

@@ -1,4 +1,9 @@
 import { withModuleFederation } from '@nx/angular/module-federation';
 import config from './module-federation.config';
 
-export default withModuleFederation(config);
+/**
+ * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support for Module Federation
+ * The DTS Plugin can be enabled by setting dts: true
+ * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
+ */
+export default withModuleFederation(config, { dts: false });

package/src/generators/setup-mf/files/ts-webpack/webpack.prod.config.ts__tmpl__

@@ -1,6 +1,11 @@
 import { withModuleFederation } from '@nx/angular/module-federation';
 import config from './module-federation.config';
 
+/**
+ * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support for Module Federation
+ * The DTS Plugin can be enabled by setting dts: true
+ * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
+ */
 export default withModuleFederation({
   ...config,
   /*
@@ -13,4 +18,4 @@ export default withModuleFederation({
    *   ['app2', 'https://app2.example.com'],
    * ]
    */
-});
+}, { dts: false });

package/src/generators/setup-mf/files/webpack/webpack.config.js__tmpl__

@@ -1,3 +1,9 @@
 const { withModuleFederation } = require('@nx/angular/module-federation');
 const config = require('./module-federation.config');
-module.exports = withModuleFederation(config);
+
+/**
+ * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support for Module Federation
+ * The DTS Plugin can be enabled by setting dts: true
+ * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
+ */
+module.exports = withModuleFederation(config, { dts: false });

package/src/generators/setup-mf/files/webpack/webpack.prod.config.js__tmpl__

@@ -1,5 +1,11 @@
 const { withModuleFederation } = require('@nx/angular/module-federation');
 const config = require('./module-federation.config');
+
+/**
+ * DTS Plugin is disabled in Nx Workspaces as Nx already provides Typing support for Module Federation
+ * The DTS Plugin can be enabled by setting dts: true
+ * Learn more about the DTS Plugin here: https://module-federation.io/configure/dts.html
+ */
 module.exports = withModuleFederation({
     ...config,
     /*
@@ -12,4 +18,4 @@ module.exports = withModuleFederation({
      *   ['app2', 'https://app2.example.com'],
      * ]
      */
-});
+}, { dts: false });

package/src/generators/stories/schema.json

@@ -27,11 +27,13 @@
     },
     "generateCypressSpecs": {
       "type": "boolean",
-      "description": "Specifies whether to automatically generate `*.spec.ts` files in the Cypress e2e app generated by the `cypress-configure` generator."
+      "description": "Specifies whether to automatically generate `*.spec.ts` files in the Cypress e2e app generated by the `cypress-configure` generator.",
+      "x-deprecated": "Use interactionTests instead. This option will be removed in v20."
     },
     "cypressProject": {
       "type": "string",
-      "description": "The Cypress project to generate the stories under. This is inferred from `name` by default."
+      "description": "The Cypress project to generate the stories under. This is inferred from `name` by default.",
+      "x-deprecated": "Use interactionTests instead. This option will be removed in v20."
     },
     "skipFormat": {
       "description": "Skip formatting files.",

package/src/migrations/update-19-6-0/turn-off-dts-by-default.d.ts

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

package/src/migrations/update-19-6-0/turn-off-dts-by-default.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = default_1;
+const devkit_1 = require("@nx/devkit");
+const minimatch_1 = require("minimatch");
+const tsquery_1 = require("@phenomnomnominal/tsquery");
+async function default_1(tree) {
+    (0, devkit_1.visitNotIgnoredFiles)(tree, '', (path) => {
+        const webpackConfigGlob = '**/webpack*.config*.{js,ts,mjs,cjs}';
+        const result = (0, minimatch_1.minimatch)(path, webpackConfigGlob);
+        if (!result) {
+            return;
+        }
+        let webpackConfigContents = tree.read(path, 'utf-8');
+        if (!/withModuleFederationSSR|withModuleFederation/.test(webpackConfigContents)) {
+            return;
+        }
+        const WITH_MODULE_FEDERATION_SELECTOR = 'CallExpression:has(Identifier[name=withModuleFederation]),CallExpression:has(Identifier[name=withModuleFederationForSSR])';
+        const EXISTING_MF_OVERRIDES_SELECTOR = 'ObjectLiteralExpression';
+        const ast = tsquery_1.tsquery.ast(webpackConfigContents);
+        const withModuleFederationNodes = (0, tsquery_1.tsquery)(ast, WITH_MODULE_FEDERATION_SELECTOR, { visitAllChildren: true });
+        if (!withModuleFederationNodes.length) {
+            return;
+        }
+        const withModuleFederationNode = withModuleFederationNodes[0];
+        const existingOverridesNodes = (0, tsquery_1.tsquery)(withModuleFederationNode, EXISTING_MF_OVERRIDES_SELECTOR, { visitAllChildren: true });
+        if (!existingOverridesNodes.length) {
+            // doesn't exist, add it
+            webpackConfigContents = `${webpackConfigContents.slice(0, withModuleFederationNode.getEnd() - 1)},${JSON.stringify({ dts: false })}${webpackConfigContents.slice(withModuleFederationNode.getEnd() - 1)}`;
+        }
+        else {
+            let existingOverrideNode;
+            for (const node of existingOverridesNodes) {
+                if (!existingOverrideNode) {
+                    existingOverrideNode = node;
+                }
+                if (existingOverrideNode.getText().includes(node.getText())) {
+                    continue;
+                }
+                existingOverrideNode = node;
+            }
+            const DTS_PROPERTY_SELECTOR = 'PropertyAssignment > Identifier[name=dts]';
+            const dtsPropertyNode = (0, tsquery_1.tsquery)(existingOverrideNode, DTS_PROPERTY_SELECTOR);
+            if (dtsPropertyNode.length) {
+                // dts already exists, do nothing
+                return;
+            }
+            const newOverrides = `{ dts: false, ${existingOverrideNode
+                .getText()
+                .slice(1)}`;
+            webpackConfigContents = `${webpackConfigContents.slice(0, existingOverrideNode.getStart())}${newOverrides}${webpackConfigContents.slice(existingOverrideNode.getEnd())}`;
+        }
+        tree.write(path, webpackConfigContents);
+    });
+    await (0, devkit_1.formatFiles)(tree);
+}

package/src/migrations/update-19-6-0/update-angular-cli.d.ts

@@ -0,0 +1,3 @@
+import { Tree } from '@nx/devkit';
+export declare const angularCliVersion = "~18.2.0";
+export default function (tree: Tree): Promise<void>;

package/src/migrations/update-19-6-0/update-angular-cli.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.angularCliVersion = void 0;
+exports.default = default_1;
+const devkit_1 = require("@nx/devkit");
+exports.angularCliVersion = '~18.2.0';
+async function default_1(tree) {
+    let shouldFormat = false;
+    (0, devkit_1.updateJson)(tree, 'package.json', (json) => {
+        if (json.devDependencies?.['@angular/cli']) {
+            json.devDependencies['@angular/cli'] = exports.angularCliVersion;
+            shouldFormat = true;
+        }
+        else if (json.dependencies?.['@angular/cli']) {
+            json.dependencies['@angular/cli'] = exports.angularCliVersion;
+            shouldFormat = true;
+        }
+        return json;
+    });
+    if (shouldFormat) {
+        await (0, devkit_1.formatFiles)(tree);
+    }
+}

package/src/utils/versions.d.ts

@@ -1,7 +1,7 @@
 export declare const nxVersion: any;
-export declare const angularVersion = "~18.1.0";
-export declare const angularDevkitVersion = "~18.1.0";
-export declare const ngPackagrVersion = "~18.1.0";
+export declare const angularVersion = "~18.2.0";
+export declare const angularDevkitVersion = "~18.2.0";
+export declare const ngPackagrVersion = "~18.2.0";
 export declare const ngrxVersion = "^18.0.1";
 export declare const rxjsVersion = "~7.8.0";
 export declare const zoneJsVersion = "~0.14.3";

package/src/utils/versions.js

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.jsoncEslintParserVersion = exports.jasmineMarblesVersion = exports.typesNodeVersion = exports.jestPresetAngularVersion = exports.tsNodeVersion = exports.autoprefixerVersion = exports.postcssUrlVersion = exports.postcssVersion = exports.tailwindVersion = exports.typescriptEslintVersion = exports.angularEslintVersion = exports.moduleFederationEnhancedVersion = exports.moduleFederationNodeVersion = exports.browserSyncVersion = exports.typesExpressVersion = exports.expressVersion = exports.typesCorsVersion = exports.corsVersion = exports.tsLibVersion = exports.angularJsVersion = exports.zoneJsVersion = exports.rxjsVersion = exports.ngrxVersion = exports.ngPackagrVersion = exports.angularDevkitVersion = exports.angularVersion = exports.nxVersion = void 0;
 exports.nxVersion = require('../../package.json').version;
-exports.angularVersion = '~18.1.0';
-exports.angularDevkitVersion = '~18.1.0';
-exports.ngPackagrVersion = '~18.1.0';
+exports.angularVersion = '~18.2.0';
+exports.angularDevkitVersion = '~18.2.0';
+exports.ngPackagrVersion = '~18.2.0';
 exports.ngrxVersion = '^18.0.1';
 exports.rxjsVersion = '~7.8.0';
 exports.zoneJsVersion = '~0.14.3';

package/src/builders/module-federation-dev-ssr/module-federation-dev-ssr.impl.d.ts

@@ -1,4 +0,0 @@
-import type { Schema } from './schema';
-export declare function executeModuleFederationDevSSRBuilder(schema: Schema, context: import('@angular-devkit/architect').BuilderContext): import("rxjs").Observable<unknown>;
-declare const _default: any;
-export default _default;

package/src/builders/module-federation-dev-ssr/module-federation-dev-ssr.impl.js

@@ -1,103 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.executeModuleFederationDevSSRBuilder = executeModuleFederationDevSSRBuilder;
-const devkit_1 = require("@nx/devkit");
-const child_process_1 = require("child_process");
-const fs_1 = require("fs");
-const ngcli_adapter_1 = require("nx/src/adapter/ngcli-adapter");
-const executor_utils_1 = require("nx/src/command-line/run/executor-utils");
-const project_graph_1 = require("nx/src/project-graph/project-graph");
-const path_1 = require("path");
-const rxjs_1 = require("rxjs");
-const operators_1 = require("rxjs/operators");
-const angular_version_utils_1 = require("../../executors/utilities/angular-version-utils");
-const module_federation_1 = require("../utilities/module-federation");
-function executeModuleFederationDevSSRBuilder(schema, context) {
-    const { ...options } = schema;
-    const projectGraph = (0, devkit_1.readCachedProjectGraph)();
-    const { projects: workspaceProjects } = (0, project_graph_1.readProjectsConfigurationFromProjectGraph)(projectGraph);
-    const project = workspaceProjects[context.target.project];
-    let pathToManifestFile;
-    if (options.pathToManifestFile) {
-        const userPathToManifestFile = (0, path_1.join)(context.workspaceRoot, options.pathToManifestFile);
-        if (!(0, fs_1.existsSync)(userPathToManifestFile)) {
-            throw new Error(`The provided Module Federation manifest file path does not exist. Please check the file exists at "${userPathToManifestFile}".`);
-        }
-        else if ((0, path_1.extname)(options.pathToManifestFile) !== '.json') {
-            throw new Error(`The Module Federation manifest file must be a JSON. Please ensure the file at ${userPathToManifestFile} is a JSON.`);
-        }
-        pathToManifestFile = userPathToManifestFile;
-    }
-    else {
-        pathToManifestFile = (0, module_federation_1.getDynamicMfManifestFile)(project, context.workspaceRoot);
-    }
-    const devServeRemotes = !options.devRemotes
-        ? []
-        : Array.isArray(options.devRemotes)
-            ? options.devRemotes
-            : [options.devRemotes];
-    // Set NX_MF_DEV_REMOTES for the Nx Runtime Library Control Plugin
-    process.env.NX_MF_DEV_REMOTES = JSON.stringify(devServeRemotes);
-    (0, module_federation_1.validateDevRemotes)({ devRemotes: devServeRemotes }, workspaceProjects);
-    const remotesToSkip = new Set(options.skipRemotes ?? []);
-    const staticRemotes = (0, module_federation_1.getStaticRemotes)(project, context, workspaceProjects, remotesToSkip);
-    const dynamicRemotes = (0, module_federation_1.getDynamicRemotes)(project, context, workspaceProjects, remotesToSkip, pathToManifestFile);
-    const remotes = [...staticRemotes, ...dynamicRemotes];
-    const remoteProcessPromises = [];
-    for (const remote of remotes) {
-        const isDev = devServeRemotes.includes(remote);
-        const target = isDev ? 'serve-ssr' : 'static-server';
-        if (!workspaceProjects[remote].targets?.[target]) {
-            throw new Error(`Could not find "${target}" target in "${remote}" project.`);
-        }
-        else if (!workspaceProjects[remote].targets?.[target].executor) {
-            throw new Error(`Could not find executor for "${target}" target in "${remote}" project.`);
-        }
-        const runOptions = {};
-        if (options.verbose) {
-            const [collection, executor] = workspaceProjects[remote].targets[target].executor.split(':');
-            const { schema } = (0, executor_utils_1.getExecutorInformation)(collection, executor, devkit_1.workspaceRoot, workspaceProjects);
-            if (schema.additionalProperties || 'verbose' in schema.properties) {
-                runOptions.verbose = options.verbose;
-            }
-        }
-        const remotePromise = new Promise((res, rej) => {
-            if (target === 'static-server') {
-                const remoteProject = workspaceProjects[remote];
-                const remoteServerOutput = (0, path_1.join)(devkit_1.workspaceRoot, remoteProject.targets.server.options.outputPath, 'main.js');
-                const pm = (0, devkit_1.getPackageManagerCommand)();
-                (0, child_process_1.execSync)(`${pm.exec} nx run ${remote}:server${context.target.configuration
-                    ? `:${context.target.configuration}`
-                    : ''}`, { stdio: 'inherit' });
-                const child = (0, child_process_1.fork)(remoteServerOutput, {
-                    env: { PORT: remoteProject.targets['serve-ssr'].options.port },
-                });
-                child.on('message', (msg) => {
-                    if (msg === 'nx.server.ready') {
-                        res();
-                    }
-                });
-            }
-            if (target === 'serve-ssr') {
-                (0, ngcli_adapter_1.scheduleTarget)(context.workspaceRoot, {
-                    project: remote,
-                    target,
-                    configuration: context.target.configuration,
-                    runOptions,
-                    projects: workspaceProjects,
-                }, options.verbose).then((obs) => obs
-                    .pipe((0, operators_1.tap)((result) => {
-                    result.success && res();
-                }))
-                    .toPromise());
-            }
-        });
-        remoteProcessPromises.push(remotePromise);
-    }
-    const { major: angularMajorVersion } = (0, angular_version_utils_1.getInstalledAngularVersionInfo)();
-    const { executeSSRDevServerBuilder } = angularMajorVersion >= 17
-        ? require('@angular-devkit/build-angular')
-        : require('@nguniversal/builders');
-    return (0, rxjs_1.from)(Promise.all(remoteProcessPromises)).pipe((0, operators_1.switchMap)(() => executeSSRDevServerBuilder(options, context)));
-}
-exports.default = require('@angular-devkit/architect').createBuilder(executeModuleFederationDevSSRBuilder);