fix(module-federation): map static remote locations correctly

nrwl · Feb 8, 2024 · dc4b780 · dc4b780
1 parent 49bba42
commit dc4b780
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 24 deletions.
diff --git a/packages/angular/src/executors/module-federation-dev-server/lib/build-static-remotes.ts b/packages/angular/src/executors/module-federation-dev-server/lib/build-static-remotes.ts
@@ -18,15 +18,6 @@ export async function buildStaticRemotes(
   ) {
     return;
   }
-  const mappedLocationOfRemotes: Record<string, string> = {};
-  for (const app of remotes.staticRemotes) {
-    mappedLocationOfRemotes[app] = `http${options.ssl ? 's' : ''}://${
-      options.host
-    }:${options.staticRemotesPort}/${app}`;
-  }
-  process.env.NX_MF_DEV_SERVER_STATIC_REMOTES = JSON.stringify(
-    mappedLocationOfRemotes
-  );
 
   await new Promise<void>((res) => {
     logger.info(

diff --git a/...ngular/src/executors/module-federation-dev-server/lib/start-static-remotes-file-server.ts b/...ngular/src/executors/module-federation-dev-server/lib/start-static-remotes-file-server.ts
@@ -1,7 +1,7 @@
 import { type ExecutorContext, workspaceRoot } from '@nx/devkit';
 import { type Schema } from '../schema';
 import fileServerExecutor from '@nx/web/src/executors/file-server/file-server.impl';
-import { dirname, join } from 'path';
+import { basename, dirname, join } from 'path';
 import { cpSync } from 'fs';
 
 export function startStaticRemotesFileServer(
@@ -15,10 +15,16 @@ export function startStaticRemotesFileServer(
 ) {
   let shouldMoveToCommonLocation = false;
   let commonOutputDirectory: string;
+  const remoteLocations: Record<string, string> = {};
+  const remoteUrls: Record<string, string> = {};
   for (const app of remotes.staticRemotes) {
     const outputPath =
       context.projectGraph.nodes[app].data.targets['build'].options.outputPath;
     const directoryOfOutputPath = dirname(outputPath);
+    remoteLocations[app] = basename(outputPath);
+    remoteUrls[app] = `http${options.ssl ? 's' : ''}://${options.host}:${
+      options.staticRemotesPort
+    }/${remoteLocations[app]}`;
 
     if (!commonOutputDirectory) {
       commonOutputDirectory = directoryOfOutputPath;
@@ -36,13 +42,15 @@ export function startStaticRemotesFileServer(
       const outputPath =
         context.projectGraph.nodes[app].data.targets['build'].options
           .outputPath;
-      cpSync(outputPath, join(commonOutputDirectory, app), {
+      cpSync(outputPath, join(commonOutputDirectory, remoteLocations[app]), {
         force: true,
         recursive: true,
       });
     }
   }
 
+  process.env.NX_MF_DEV_SERVER_STATIC_REMOTES = JSON.stringify(remoteUrls);
+
   const staticRemotesIter = fileServerExecutor(
     {
       cors: true,

diff --git a/...ges/react/src/executors/module-federation-dev-server/module-federation-dev-server.impl.ts b/...ges/react/src/executors/module-federation-dev-server/module-federation-dev-server.impl.ts
@@ -19,7 +19,7 @@ import {
 } from '@nx/devkit/src/utils/async-iterable';
 import { waitForPortOpen } from '@nx/web/src/utils/wait-for-port-open';
 import { fork } from 'child_process';
-import { dirname, join } from 'path';
+import { basename, dirname, join } from 'path';
 import { cpSync } from 'fs';
 
 type ModuleFederationDevServerOptions = WebDevServerOptions & {
@@ -52,10 +52,16 @@ function startStaticRemotesFileServer(
 ) {
   let shouldMoveToCommonLocation = false;
   let commonOutputDirectory: string;
+  const remoteLocations: Record<string, string> = {};
+  const remoteUrls: Record<string, string> = {};
   for (const app of remotes.staticRemotes) {
     const outputPath =
       context.projectGraph.nodes[app].data.targets['build'].options.outputPath;
     const directoryOfOutputPath = dirname(outputPath);
+    remoteLocations[app] = basename(outputPath);
+    remoteUrls[app] = `http${options.ssl ? 's' : ''}://${options.host}:${
+      options.staticRemotesPort
+    }/${remoteLocations[app]}`;
 
     if (!commonOutputDirectory) {
       commonOutputDirectory = directoryOfOutputPath;
@@ -73,13 +79,15 @@ function startStaticRemotesFileServer(
       const outputPath =
         context.projectGraph.nodes[app].data.targets['build'].options
           .outputPath;
-      cpSync(outputPath, join(commonOutputDirectory, app), {
+      cpSync(outputPath, join(commonOutputDirectory, remoteLocations[app]), {
         force: true,
         recursive: true,
       });
     }
   }
 
+  process.env.NX_MF_DEV_SERVER_STATIC_REMOTES = JSON.stringify(remoteUrls);
+
   const staticRemotesIter = fileServerExecutor(
     {
       cors: true,
@@ -151,17 +159,6 @@ async function buildStaticRemotes(
     return;
   }
   logger.info(`NX Building ${remotes.staticRemotes.length} static remotes...`);
-  const mappedLocationOfRemotes: Record<string, string> = {};
-
-  for (const app of remotes.staticRemotes) {
-    mappedLocationOfRemotes[app] = `http${options.ssl ? 's' : ''}://${
-      options.host
-    }:${options.staticRemotesPort}/${app}`;
-  }
-
-  process.env.NX_MF_DEV_SERVER_STATIC_REMOTES = JSON.stringify(
-    mappedLocationOfRemotes
-  );
 
   await new Promise<void>((res) => {
     const staticProcess = fork(