@nx/react 0.0.0-pr-22179-271588f → 0.0.0-pr-26482-ebe2dba

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

@@ -7,9 +7,12 @@ const file_server_impl_1 = require("@nx/web/src/executors/file-server/file-serve
 const module_federation_1 = require("@nx/webpack/src/utils/module-federation");
 const async_iterable_1 = require("@nx/devkit/src/utils/async-iterable");
 const wait_for_port_open_1 = require("@nx/web/src/utils/wait-for-port-open");
-const child_process_1 = require("child_process");
-const path_1 = require("path");
+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");
 const fs_1 = require("fs");
+const path_1 = require("path");
 function getBuildOptions(buildTarget, context) {
     const target = (0, devkit_1.parseTargetString)(buildTarget, context);
     const buildOptions = (0, devkit_1.readTargetOptions)(target, context);
@@ -31,10 +34,10 @@ function startStaticRemotesFileServer(staticRemotesConfig, context, options) {
         }
     }
     if (shouldMoveToCommonLocation) {
-        commonOutputDirectory = (0, path_1.join)(devkit_1.workspaceRoot, 'tmp/static-remotes');
+        commonOutputDirectory = (0, node_path_1.join)(devkit_1.workspaceRoot, 'tmp/static-remotes');
         for (const app of staticRemotesConfig.remotes) {
             const remoteConfig = staticRemotesConfig.config[app];
-            (0, fs_1.cpSync)(remoteConfig.outputPath, (0, path_1.join)(commonOutputDirectory, remoteConfig.urlSegment), {
+            (0, node_fs_1.cpSync)(remoteConfig.outputPath, (0, node_path_1.join)(commonOutputDirectory, remoteConfig.urlSegment), {
                 force: true,
                 recursive: true,
             });
@@ -55,27 +58,34 @@ function startStaticRemotesFileServer(staticRemotesConfig, context, options) {
     }, context);
     return staticRemotesIter;
 }
-async function startDevRemotes(remotes, context, options) {
-    const devRemoteIters = [];
-    for (const app of remotes.devRemotes) {
-        const remoteProjectServeTarget = context.projectGraph.nodes[app].data.targets['serve'];
+async function startRemotes(remotes, context, options, target = 'serve') {
+    const remoteIters = [];
+    for (const app of remotes) {
+        const remoteProjectServeTarget = context.projectGraph.nodes[app].data.targets[target];
         const isUsingModuleFederationDevServerExecutor = remoteProjectServeTarget.executor.includes('module-federation-dev-server');
-        devRemoteIters.push(await (0, devkit_1.runExecutor)({
-            project: app,
-            target: 'serve',
-            configuration: context.configurationName,
-        }, {
-            watch: true,
+        const configurationOverride = options.devRemotes?.find((r) => typeof r !== 'string' && r.remoteName === app)?.configuration;
+        const defaultOverrides = {
             ...(options.host ? { host: options.host } : {}),
             ...(options.ssl ? { ssl: options.ssl } : {}),
             ...(options.sslCert ? { sslCert: options.sslCert } : {}),
             ...(options.sslKey ? { sslKey: options.sslKey } : {}),
-            ...(isUsingModuleFederationDevServerExecutor
-                ? { isInitialHost: false }
-                : {}),
-        }, context));
+        };
+        const overrides = target === 'serve'
+            ? {
+                watch: true,
+                ...(isUsingModuleFederationDevServerExecutor
+                    ? { isInitialHost: false }
+                    : {}),
+                ...defaultOverrides,
+            }
+            : { ...defaultOverrides };
+        remoteIters.push(await (0, devkit_1.runExecutor)({
+            project: app,
+            target,
+            configuration: configurationOverride ?? context.configurationName,
+        }, overrides, context));
     }
-    return devRemoteIters;
+    return remoteIters;
 }
 async function buildStaticRemotes(staticRemotesConfig, nxBin, context, options) {
     if (!staticRemotesConfig.remotes.length) {
@@ -88,7 +98,7 @@ async function buildStaticRemotes(staticRemotesConfig, nxBin, context, options)
     }
     process.env.NX_MF_DEV_SERVER_STATIC_REMOTES = JSON.stringify(mappedLocationOfRemotes);
     await new Promise((res) => {
-        const staticProcess = (0, child_process_1.fork)(nxBin, [
+        const staticProcess = (0, node_child_process_1.fork)(nxBin, [
             'run-many',
             `--target=build`,
             `--projects=${staticRemotesConfig.remotes.join(',')}`,
@@ -100,9 +110,13 @@ async function buildStaticRemotes(staticRemotesConfig, nxBin, context, options)
             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);
             if (stdoutString.includes('Successfully ran target build')) {
                 staticProcess.stdout.removeAllListeners('data');
                 devkit_1.logger.info(`NX Built ${staticRemotesConfig.remotes.length} static remotes`);
@@ -111,8 +125,9 @@ async function buildStaticRemotes(staticRemotesConfig, nxBin, context, options)
         });
         staticProcess.stderr.on('data', (data) => devkit_1.logger.info(data.toString()));
         staticProcess.on('exit', (code) => {
+            stdoutStream.end();
             if (code !== 0) {
-                throw new Error(`Remote failed to start. See above for errors.`);
+                throw new Error(`Remote failed to start. A complete log can be found in: ${remoteBuildLogFile}`);
             }
         });
         process.on('SIGTERM', () => staticProcess.kill('SIGTERM'));
@@ -126,8 +141,8 @@ function parseStaticRemotesConfig(staticRemotes, context) {
     const config = {};
     for (const app of staticRemotes) {
         const outputPath = context.projectGraph.nodes[app].data.targets['build'].options.outputPath;
-        const basePath = (0, path_1.dirname)(outputPath);
-        const urlSegment = (0, path_1.basename)(outputPath);
+        const basePath = (0, node_path_1.dirname)(outputPath);
+        const urlSegment = (0, node_path_1.basename)(outputPath);
         config[app] = { basePath, outputPath, urlSegment };
     }
     return { remotes: staticRemotes, config };
@@ -149,18 +164,32 @@ async function* moduleFederationDevServer(options, context) {
         : (0, dev_server_impl_1.default)(options, context);
     const p = context.projectsConfigurations.projects[context.projectName];
     const buildOptions = getBuildOptions(options.buildTarget, context);
+    let pathToManifestFile = (0, node_path_1.join)(context.root, p.sourceRoot, 'assets/module-federation.manifest.json');
+    if (options.pathToManifestFile) {
+        const userPathToManifestFile = (0, node_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;
+    }
     if (!options.isInitialHost) {
         return yield* currIter;
     }
     const moduleFederationConfig = (0, module_federation_1.getModuleFederationConfig)(buildOptions.tsConfig, context.root, p.root, 'react');
-    const remotes = (0, module_federation_1.getRemotes)(options.devRemotes, options.skipRemotes, moduleFederationConfig, {
+    const remoteNames = options.devRemotes?.map((r) => typeof r === 'string' ? r : r.remoteName);
+    const remotes = (0, module_federation_1.getRemotes)(remoteNames, options.skipRemotes, moduleFederationConfig, {
         projectName: context.projectName,
         projectGraph: context.projectGraph,
         root: context.root,
-    });
+    }, pathToManifestFile);
     if (remotes.devRemotes.length > 0 && !initialStaticRemotesPorts) {
         options.staticRemotesPort = options.devRemotes.reduce((portToUse, r) => {
-            const remotePort = context.projectGraph.nodes[r].data.targets['serve'].options.port;
+            const remoteName = typeof r === 'string' ? r : r.remoteName;
+            const remotePort = context.projectGraph.nodes[remoteName].data.targets['serve'].options
+                .port;
             if (remotePort >= portToUse) {
                 return remotePort + 1;
             }
@@ -171,11 +200,12 @@ async function* moduleFederationDevServer(options, context) {
     }
     const staticRemotesConfig = parseStaticRemotesConfig(remotes.staticRemotes, context);
     await buildStaticRemotes(staticRemotesConfig, nxBin, context, options);
-    const devRemoteIters = await startDevRemotes(remotes, context, options);
+    const devRemoteIters = await startRemotes(remotes.devRemotes, context, options, 'serve');
+    const dynamicRemotesIters = await startRemotes(remotes.dynamicRemotes, context, options, 'serve-static');
     const staticRemotesIter = remotes.staticRemotes.length > 0
         ? startStaticRemotesFileServer(staticRemotesConfig, context, options)
         : undefined;
-    return yield* (0, async_iterable_1.combineAsyncIterables)(currIter, ...devRemoteIters, ...(staticRemotesIter ? [staticRemotesIter] : []), (0, async_iterable_1.createAsyncIterable)(async ({ next, done }) => {
+    return yield* (0, async_iterable_1.combineAsyncIterables)(currIter, ...devRemoteIters, ...dynamicRemotesIters, ...(staticRemotesIter ? [staticRemotesIter] : []), (0, async_iterable_1.createAsyncIterable)(async ({ next, done }) => {
         if (!options.isInitialHost) {
             done();
             return;

package/src/executors/module-federation-dev-server/schema.json

@@ -9,7 +9,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"
@@ -19,7 +36,7 @@
       "items": {
         "type": "string"
       },
-      "description": "List of remote applications to not automatically serve, either statically or in development mode. This will not remove the remotes from the `module-federation.config` file, and therefore the application may still try to fetch these remotes.\nThis option is useful for when the `host` application is using a `remote` that does not live in the same workspace as the `host`.",
+      "description": "List of remote applications to not automatically serve, either statically or in development mode. This will not remove the remotes from the `module-federation.config` file, and therefore the application may still try to fetch these remotes.\nThis option is useful if you have other means for serving the `remote` application(s).\n**NOTE:** Remotes that are not in the workspace will be skipped automatically.",
       "x-priority": "important"
     },
     "buildTarget": {
@@ -109,6 +126,11 @@
     "staticRemotesPort": {
       "type": "number",
       "description": "The port at which to serve the file-server for the static remotes."
+    },
+    "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."
     }
-  }
+  },
+  "examplesFile": "../../../docs/module-federation-dev-server-examples.md"
 }

package/src/generators/application/application.js

@@ -62,7 +62,6 @@ async function applicationGenerator(host, schema) {
 exports.applicationGenerator = applicationGenerator;
 async function applicationGeneratorInternal(host, schema) {
     const tasks = [];
-    console.log('Well hello Katerina!');
     const options = await (0, normalize_options_1.normalizeOptions)(host, schema);
     (0, show_possible_warnings_1.showPossibleWarnings)(host, options);
     const jsInitTask = await (0, js_1.initGenerator)(host, {
@@ -76,6 +75,20 @@ async function applicationGeneratorInternal(host, schema) {
         skipFormat: true,
     });
     tasks.push(initTask);
+    if (!options.addPlugin) {
+        const nxJson = (0, devkit_1.readNxJson)(host);
+        nxJson.targetDefaults ??= {};
+        if (!Object.keys(nxJson.targetDefaults).includes('build')) {
+            nxJson.targetDefaults.build = {
+                cache: true,
+                dependsOn: ['^build'],
+            };
+        }
+        else if (!nxJson.targetDefaults.build.dependsOn) {
+            nxJson.targetDefaults.build.dependsOn = ['^build'];
+        }
+        (0, devkit_1.updateNxJson)(host, nxJson);
+    }
     if (options.bundler === 'webpack') {
         const { webpackInitGenerator } = (0, devkit_1.ensurePackage)('@nx/webpack', versions_1.nxVersion);
         const webpackInitTask = await webpackInitGenerator(host, {
@@ -144,7 +157,7 @@ async function applicationGeneratorInternal(host, schema) {
             tsConfig: (0, devkit_1.joinPathFragments)(options.appProjectRoot, 'tsconfig.app.json'),
             target: 'web',
             newProject: true,
-            uiFramework: 'react',
+            framework: 'react',
         });
         tasks.push(rspackTask);
     }
@@ -202,8 +215,8 @@ async function applicationGeneratorInternal(host, schema) {
         devkit_1.logger.warn(`${chalk.bold('styled-jsx')} is not supported by ${chalk.bold('Rspack')}. We've added ${chalk.bold('babel-loader')} to your project, but using babel will slow down your build.`);
         tasks.push((0, devkit_1.addDependenciesToPackageJson)(host, {}, { 'babel-loader': versions_1.babelLoaderVersion }));
         host.write((0, devkit_1.joinPathFragments)(options.appProjectRoot, 'rspack.config.js'), (0, devkit_1.stripIndents) `
-        const { composePlugins, withNx, withWeb } = require('@nx/rspack');
-        module.exports = composePlugins(withNx(), withWeb(), (config) => {
+        const { composePlugins, withNx, withReact } = require('@nx/rspack');
+        module.exports = composePlugins(withNx(), withReact(), (config) => {
           config.module.rules.push({
             test: /\\.[jt]sx$/i,
             use: [

package/src/generators/application/files/base-webpack/webpack.config.js__tmpl__

@@ -1,6 +1,6 @@
 <% if (webpackPluginOptions) { %>
-const { NxWebpackPlugin } = require('@nx/webpack');
-const { NxReactWebpackPlugin } = require('@nx/react');
+const { NxAppWebpackPlugin } = require('@nx/webpack/app-plugin');
+const { NxReactWebpackPlugin } = require('@nx/react/webpack-plugin');
 const { join } = require('path');
 
 module.exports = {
@@ -11,7 +11,7 @@ module.exports = {
     port: 4200
   },
   plugins: [
-    new NxWebpackPlugin({
+    new NxAppWebpackPlugin({
       tsConfig: '<%= webpackPluginOptions.tsConfig %>',
       compiler: '<%= webpackPluginOptions.compiler %>',
       main: '<%= webpackPluginOptions.main %>',

package/src/generators/application/lib/add-e2e.js

@@ -12,9 +12,10 @@ async function addE2e(tree, options) {
             const hasNxBuildPlugin = (options.bundler === 'webpack' && (0, has_webpack_plugin_1.hasWebpackPlugin)(tree)) ||
                 (options.bundler === 'vite' && (0, has_vite_plugin_1.hasVitePlugin)(tree));
             if (!hasNxBuildPlugin) {
-                (0, web_1.webStaticServeGenerator)(tree, {
+                await (0, web_1.webStaticServeGenerator)(tree, {
                     buildTarget: `${options.projectName}:build`,
                     targetName: 'serve-static',
+                    spa: true,
                 });
             }
             const { configurationGenerator } = (0, devkit_1.ensurePackage)('@nx/cypress', versions_1.nxVersion);
@@ -33,13 +34,13 @@ async function addE2e(tree, options) {
                 // the name and root are already normalized, instruct the generator to use them as is
                 bundler: options.bundler === 'rspack' ? 'webpack' : options.bundler,
                 skipFormat: true,
-                devServerTarget: `${options.projectName}:serve`,
-                baseUrl: `http://localhost:${options.devServerPort ?? 4200}`,
+                devServerTarget: `${options.projectName}:${options.e2eWebServerTarget}`,
+                baseUrl: options.e2eWebServerAddress,
                 jsx: true,
                 rootProject: options.rootProject,
                 webServerCommands: hasNxBuildPlugin
                     ? {
-                        default: `nx run ${options.projectName}:serve`,
+                        default: `nx run ${options.projectName}:${options.e2eWebServerTarget}`,
                         production: `nx run ${options.projectName}:preview`,
                     }
                     : undefined,
@@ -65,8 +66,8 @@ async function addE2e(tree, options) {
                 js: false,
                 linter: options.linter,
                 setParserOptionsProject: options.setParserOptionsProject,
-                webServerCommand: `${(0, devkit_1.getPackageManagerCommand)().exec} nx serve ${options.name}`,
-                webServerAddress: `http://localhost:${options.devServerPort ?? 4200}`,
+                webServerCommand: `${(0, devkit_1.getPackageManagerCommand)().exec} nx ${options.e2eWebServerTarget} ${options.name}`,
+                webServerAddress: options.e2eWebServerAddress,
                 rootProject: options.rootProject,
                 addPlugin: options.addPlugin,
             });

package/src/generators/application/lib/normalize-options.js

@@ -32,8 +32,35 @@ async function normalizeOptions(host, options, callingGenerator = '@nx/react:app
     options.addPlugin ??= addPlugin;
     options.rootProject = appProjectRoot === '.';
     options.projectNameAndRootFormat = projectNameAndRootFormat;
+    let e2eWebServerTarget = 'serve';
+    if (options.addPlugin) {
+        if (nxJson.plugins) {
+            for (const plugin of nxJson.plugins) {
+                if (options.bundler === 'vite' &&
+                    typeof plugin === 'object' &&
+                    plugin.plugin === '@nx/vite/plugin' &&
+                    plugin.options.serveTargetName) {
+                    e2eWebServerTarget = plugin.options
+                        .serveTargetName;
+                }
+                else if (options.bundler === 'webpack' &&
+                    typeof plugin === 'object' &&
+                    plugin.plugin === '@nx/webpack/plugin' &&
+                    plugin.options.serveTargetName) {
+                    e2eWebServerTarget = plugin.options
+                        .serveTargetName;
+                }
+            }
+        }
+    }
+    let e2ePort = options.devServerPort ?? 4200;
+    if (nxJson.targetDefaults?.[e2eWebServerTarget] &&
+        nxJson.targetDefaults?.[e2eWebServerTarget].options?.port) {
+        e2ePort = nxJson.targetDefaults?.[e2eWebServerTarget].options?.port;
+    }
     const e2eProjectName = options.rootProject ? 'e2e' : `${appProjectName}-e2e`;
     const e2eProjectRoot = options.rootProject ? 'e2e' : `${appProjectRoot}-e2e`;
+    const e2eWebServerAddress = `http://localhost:${e2ePort}`;
     const parsedTags = options.tags
         ? options.tags.split(',').map((s) => s.trim())
         : [];
@@ -42,9 +69,6 @@ async function normalizeOptions(host, options, callingGenerator = '@nx/react:app
         ? null
         : options.style;
     (0, assertion_1.assertValidStyle)(options.style);
-    if (options.bundler === 'vite' && options.unitTestRunner !== 'none') {
-        options.unitTestRunner = 'vitest';
-    }
     const normalized = {
         ...options,
         name: (0, devkit_1.names)(options.name).fileName,
@@ -52,6 +76,9 @@ async function normalizeOptions(host, options, callingGenerator = '@nx/react:app
         appProjectRoot,
         e2eProjectName,
         e2eProjectRoot,
+        e2eWebServerAddress,
+        e2eWebServerTarget,
+        e2ePort,
         parsedTags,
         fileName,
         styledModule,
@@ -63,7 +90,7 @@ async function normalizeOptions(host, options, callingGenerator = '@nx/react:app
     normalized.compiler = normalized.compiler ?? 'babel';
     normalized.bundler = normalized.bundler ?? 'webpack';
     normalized.unitTestRunner = normalized.unitTestRunner ?? 'jest';
-    normalized.e2eTestRunner = normalized.e2eTestRunner ?? 'cypress';
+    normalized.e2eTestRunner = normalized.e2eTestRunner ?? 'playwright';
     normalized.inSourceTests = normalized.minimal || normalized.inSourceTests;
     normalized.devServerPort ??= (0, find_free_port_1.findFreePort)(host);
     normalized.minimal = normalized.minimal ?? false;

package/src/generators/application/schema.d.ts

@@ -36,6 +36,9 @@ export interface NormalizedSchema<T extends Schema = Schema> extends T {
   appProjectRoot: string;
   e2eProjectName: string;
   e2eProjectRoot: string;
+  e2eWebServerAddress: string;
+  e2eWebServerTarget: string;
+  e2ePort: number;
   parsedTags: string[];
   fileName: string;
   styledModule: null | SupportedStyles;

package/src/generators/application/schema.json

@@ -122,10 +122,10 @@
     },
     "e2eTestRunner": {
       "type": "string",
-      "enum": ["cypress", "playwright", "none"],
+      "enum": ["playwright", "cypress", "none"],
       "description": "Test runner to use for end to end (E2E) tests.",
       "x-prompt": "Which E2E test runner would you like to use?",
-      "default": "cypress"
+      "default": "playwright"
     },
     "tags": {
       "type": "string",

package/src/generators/component/files/__fileName__.tsx__tmpl__

@@ -23,10 +23,6 @@ import { Route, Link } from 'react-router-dom';
     var extras = '';
 } %>
 
-/* eslint-disable-next-line */
-export interface <%= className %>Props {
-}
-
 <% if (styledModule && styledModule !== 'styled-jsx') { %>
 const Styled<%= className %> = styled.div`
   color: pink;
@@ -34,7 +30,7 @@ const Styled<%= className %> = styled.div`
 <% }%>
 <% if(!isNextPage) { %>
   <% if (classComponent) { %>
-  export class <%= className %> extends Component<<%= className %>Props> {
+  export class <%= className %> extends Component<{}> {
     override render() {
       return (
         <<%= wrapper %><%- extras %>>
@@ -51,7 +47,7 @@ const Styled<%= className %> = styled.div`
     }
   }
   <% } else { %>
-  export function <%= className %>(props: <%= className %>Props) {
+  export function <%= className %>() {
     return (
       <<%= wrapper %><%- extras %>>
         <% if (styledModule === 'styled-jsx') { %><style jsx>{`div { color: pink; }`}</style><% } %>
@@ -69,7 +65,7 @@ const Styled<%= className %> = styled.div`
 
   export default <%= className %>;
 <% } else { %>
-  export default function <%= className %>(props: <%= className %>Props) {
+  export default function <%= className %>() {
     return (
       <<%= wrapper %><%- extras %>>
         <% if (styledModule === 'styled-jsx') { %><style jsx>{`div { color: pink; }`}</style><% } %>

package/src/generators/component/schema.d.ts

@@ -3,7 +3,7 @@ import { SupportedStyles } from '../../../typings/style';
 export interface Schema {
   name: string;
   /**
-   * @deprecated Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v19.
+   * @deprecated Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v20.
    */
   project?: string;
   style: SupportedStyles;

package/src/generators/component/schema.json

@@ -13,7 +13,7 @@
       "$default": {
         "$source": "projectName"
       },
-      "x-deprecated": "Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v19."
+      "x-deprecated": "Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v20."
     },
     "name": {
       "type": "string",

package/src/generators/hook/schema.d.ts

@@ -1,7 +1,7 @@
 export interface Schema {
   name: string;
   /**
-   * @deprecated Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v19.
+   * @deprecated Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v20.
    */
   project: string;
   skipTests?: boolean;

package/src/generators/hook/schema.json

@@ -19,7 +19,7 @@
       "$default": {
         "$source": "projectName"
       },
-      "x-deprecated": "Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v19."
+      "x-deprecated": "Provide the `directory` option instead and use the `as-provided` format. The project will be determined from the directory provided. It will be removed in Nx v20."
     },
     "name": {
       "type": "string",
@@ -56,7 +56,7 @@
       "type": "boolean",
       "description": "Create hook at the source root rather than its own directory.",
       "default": false,
-      "x-deprecated": "Provide the `directory` option instead and use the `as-provided` format. It will be removed in Nx v19."
+      "x-deprecated": "Provide the `directory` option instead and use the `as-provided` format. It will be removed in Nx v20."
     },
     "export": {
       "type": "boolean",

package/src/generators/host/host.js

@@ -12,6 +12,7 @@ const normalize_remote_1 = require("./lib/normalize-remote");
 const setup_ssr_for_host_1 = require("./lib/setup-ssr-for-host");
 const update_module_federation_e2e_project_1 = require("./lib/update-module-federation-e2e-project");
 const add_mf_env_to_inputs_1 = require("../../utils/add-mf-env-to-inputs");
+const js_1 = require("@nx/js");
 async function hostGenerator(host, schema) {
     return hostGeneratorInternal(host, {
         projectNameAndRootFormat: 'derived',
@@ -31,6 +32,16 @@ async function hostGeneratorInternal(host, schema) {
         // TODO(colum): remove when MF works with Crystal
         addPlugin: false,
     };
+    // Check to see if remotes are provided and also check if --dynamic is provided
+    // if both are check that the remotes are valid names else throw an error.
+    if (options.dynamic && options.remotes?.length > 0) {
+        options.remotes.forEach((remote) => {
+            const isValidRemote = (0, js_1.isValidVariable)(remote);
+            if (!isValidRemote.isValid) {
+                throw new Error(`Invalid remote name provided: ${remote}. ${isValidRemote.message}`);
+            }
+        });
+    }
     const initTask = await (0, application_1.default)(host, {
         ...options,
         // The target use-case is loading remotes as child routes, thus always enable routing.

package/src/generators/host/schema.json

@@ -103,10 +103,10 @@
     },
     "e2eTestRunner": {
       "type": "string",
-      "enum": ["cypress", "playwright", "none"],
+      "enum": ["playwright", "cypress", "none"],
       "description": "Test runner to use for end to end (E2E) tests.",
       "x-prompt": "Which E2E test runner would you like to use?",
-      "default": "cypress"
+      "default": "playwright"
     },
     "tags": {
       "type": "string",