@nx/react 18.0.3 → 18.1.0-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/react",
-  "version": "18.0.3",
+  "version": "18.1.0-beta.0",
   "private": false,
   "description": "The React plugin for Nx contains executors and generators for managing React applications and libraries within an Nx workspace. It provides:\n\n\n- Integration with libraries such as Jest, Cypress, and Storybook.\n\n- Generators for applications, libraries, components, hooks, and more.\n\n- Library build support for publishing packages to npm or other registries.\n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -36,11 +36,11 @@
     "chalk": "^4.1.0",
     "minimatch": "9.0.3",
     "tslib": "^2.3.0",
-    "@nx/devkit": "18.0.3",
-    "@nx/js": "18.0.3",
-    "@nx/eslint": "18.0.3",
-    "@nx/web": "18.0.3",
-    "@nrwl/react": "18.0.3"
+    "@nx/devkit": "18.1.0-beta.0",
+    "@nx/js": "18.1.0-beta.0",
+    "@nx/eslint": "18.1.0-beta.0",
+    "@nx/web": "18.1.0-beta.0",
+    "@nrwl/react": "18.1.0-beta.0"
   },
   "publishConfig": {
     "access": "public"

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

@@ -8,6 +8,16 @@ type ModuleFederationDevServerOptions = WebDevServerOptions & {
     parallel?: number;
     staticRemotesPort?: number;
 };
+type StaticRemoteConfig = {
+    basePath: string;
+    outputPath: string;
+    urlSegment: string;
+};
+type StaticRemotesConfig = {
+    remotes: string[];
+    config: Record<string, StaticRemoteConfig> | undefined;
+};
+export declare function parseStaticRemotesConfig(staticRemotes: string[] | undefined, context: ExecutorContext): StaticRemotesConfig;
 export default function moduleFederationDevServer(options: ModuleFederationDevServerOptions, context: ExecutorContext): AsyncIterableIterator<{
     success: boolean;
     baseUrl?: string;

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

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseStaticRemotesConfig = void 0;
 const devkit_1 = require("@nx/devkit");
 const dev_server_impl_1 = require("@nx/webpack/src/executors/dev-server/dev-server.impl");
 const file_server_impl_1 = require("@nx/web/src/executors/file-server/file-server.impl");
@@ -16,26 +17,24 @@ function getBuildOptions(buildTarget, context) {
         ...buildOptions,
     };
 }
-function startStaticRemotesFileServer(remotes, context, options) {
+function startStaticRemotesFileServer(staticRemotesConfig, context, options) {
     let shouldMoveToCommonLocation = false;
     let commonOutputDirectory;
-    for (const app of remotes.staticRemotes) {
-        const outputPath = context.projectGraph.nodes[app].data.targets['build'].options.outputPath;
-        const directoryOfOutputPath = (0, path_1.dirname)(outputPath);
+    for (const app of staticRemotesConfig.remotes) {
+        const remoteBasePath = staticRemotesConfig.config[app].basePath;
         if (!commonOutputDirectory) {
-            commonOutputDirectory = directoryOfOutputPath;
+            commonOutputDirectory = remoteBasePath;
         }
-        else if (commonOutputDirectory !== directoryOfOutputPath ||
-            !outputPath.endsWith(app)) {
+        else if (commonOutputDirectory !== remoteBasePath) {
             shouldMoveToCommonLocation = true;
+            break;
         }
     }
     if (shouldMoveToCommonLocation) {
         commonOutputDirectory = (0, path_1.join)(devkit_1.workspaceRoot, 'tmp/static-remotes');
-        for (const app of remotes.staticRemotes) {
-            const outputPath = context.projectGraph.nodes[app].data.targets['build'].options
-                .outputPath;
-            (0, fs_1.cpSync)(outputPath, (0, path_1.join)(commonOutputDirectory, app), {
+        for (const app of staticRemotesConfig.remotes) {
+            const remoteConfig = staticRemotesConfig.config[app];
+            (0, fs_1.cpSync)(remoteConfig.outputPath, (0, path_1.join)(commonOutputDirectory, remoteConfig.urlSegment), {
                 force: true,
                 recursive: true,
             });
@@ -74,21 +73,21 @@ async function startDevRemotes(remotes, context) {
     }
     return devRemoteIters;
 }
-async function buildStaticRemotes(remotes, nxBin, context, options) {
-    if (!remotes.staticRemotes.length) {
+async function buildStaticRemotes(staticRemotesConfig, nxBin, context, options) {
+    if (!staticRemotesConfig.remotes.length) {
         return;
     }
-    devkit_1.logger.info(`NX Building ${remotes.staticRemotes.length} static remotes...`);
+    devkit_1.logger.info(`NX Building ${staticRemotesConfig.remotes.length} static remotes...`);
     const mappedLocationOfRemotes = {};
-    for (const app of remotes.staticRemotes) {
-        mappedLocationOfRemotes[app] = `http${options.ssl ? 's' : ''}://${options.host}:${options.staticRemotesPort}/${app}`;
+    for (const app of staticRemotesConfig.remotes) {
+        mappedLocationOfRemotes[app] = `http${options.ssl ? 's' : ''}://${options.host}:${options.staticRemotesPort}/${staticRemotesConfig.config[app].urlSegment}`;
     }
     process.env.NX_MF_DEV_SERVER_STATIC_REMOTES = JSON.stringify(mappedLocationOfRemotes);
     await new Promise((res) => {
         const staticProcess = (0, child_process_1.fork)(nxBin, [
             'run-many',
             `--target=build`,
-            `--projects=${remotes.staticRemotes.join(',')}`,
+            `--projects=${staticRemotesConfig.remotes.join(',')}`,
             ...(context.configurationName
                 ? [`--configuration=${context.configurationName}`]
                 : []),
@@ -102,7 +101,7 @@ async function buildStaticRemotes(remotes, nxBin, context, options) {
             const stdoutString = data.toString().replace(ANSII_CODE_REGEX, '');
             if (stdoutString.includes('Successfully ran target build')) {
                 staticProcess.stdout.removeAllListeners('data');
-                devkit_1.logger.info(`NX Built ${remotes.staticRemotes.length} static remotes`);
+                devkit_1.logger.info(`NX Built ${staticRemotesConfig.remotes.length} static remotes`);
                 res();
             }
         });
@@ -116,6 +115,20 @@ async function buildStaticRemotes(remotes, nxBin, context, options) {
         process.on('exit', () => staticProcess.kill('SIGTERM'));
     });
 }
+function parseStaticRemotesConfig(staticRemotes, context) {
+    if (!staticRemotes?.length) {
+        return { remotes: [], config: undefined };
+    }
+    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);
+        config[app] = { basePath, outputPath, urlSegment };
+    }
+    return { remotes: staticRemotes, config };
+}
+exports.parseStaticRemotesConfig = parseStaticRemotesConfig;
 async function* moduleFederationDevServer(options, context) {
     const initialStaticRemotesPorts = options.staticRemotesPort;
     options.staticRemotesPort ??= options.port + 1;
@@ -152,10 +165,11 @@ async function* moduleFederationDevServer(options, context) {
             }
         }, options.staticRemotesPort);
     }
-    await buildStaticRemotes(remotes, nxBin, context, options);
+    const staticRemotesConfig = parseStaticRemotesConfig(remotes.staticRemotes, context);
+    await buildStaticRemotes(staticRemotesConfig, nxBin, context, options);
     const devRemoteIters = await startDevRemotes(remotes, context);
     const staticRemotesIter = remotes.staticRemotes.length > 0
-        ? startStaticRemotesFileServer(remotes, context, options)
+        ? startStaticRemotesFileServer(staticRemotesConfig, context, options)
         : undefined;
     return yield* (0, async_iterable_1.combineAsyncIterables)(currIter, ...devRemoteIters, ...(staticRemotesIter ? [staticRemotesIter] : []), (0, async_iterable_1.createAsyncIterable)(async ({ next, done }) => {
         if (!options.isInitialHost) {