feat(module-federation): use nx run-many to build static remotes in parallel (#19987)

docs/generated/packages/angular/executors/module-federation-dev-server.json

@@ -122,6 +122,10 @@
         "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"
       }
     },
     "additionalProperties": false,

docs/generated/packages/react/executors/module-federation-dev-server.json

@@ -100,6 +100,10 @@
         "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"
       }
     },
     "presets": []

packages/angular/src/builders/module-federation-dev-server/module-federation-dev-server.impl.ts

@@ -121,6 +121,48 @@ export function executeModuleFederationDevServerBuilder(
     pathToManifestFile
   );
 
+  const staticRemoteBuildPromise = new Promise<void>((res) => {
+    logger.info(
+      `NX Building ${remotes.staticRemotes.length} static remotes...`
+    );
+    const staticProcess = fork(
+      nxBin,
+      [
+        'run-many',
+        `--target=build`,
+        `--projects=${remotes.staticRemotes.join(',')}`,
+        ...(context.target.configuration
+          ? [`--configuration=${context.target.configuration}`]
+          : []),
+        ...(options.parallel ? [`--parallel=${options.parallel}`] : []),
+      ],
+      {
+        cwd: context.workspaceRoot,
+        stdio: ['ignore', 'pipe', 'pipe', 'ipc'],
+      }
+    );
+    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, '');
+      if (stdoutString.includes('Successfully ran target build')) {
+        staticProcess.stdout.removeAllListeners('data');
+        logger.info(`NX Built ${remotes.staticRemotes.length} static remotes`);
+        res();
+      }
+    });
+    staticProcess.stderr.on('data', (data) => logger.info(data.toString()));
+    staticProcess.on('exit', (code) => {
+      if (code !== 0) {
+        throw new Error(`Remotes failed to build. See above for errors.`);
+      }
+    });
+    process.on('SIGTERM', () => staticProcess.kill('SIGTERM'));
+    process.on('exit', () => staticProcess.kill('SIGTERM'));
+  });
+
+  return from(staticRemoteBuildPromise).pipe(
+    concatMap(() => {
       let isCollectingStaticRemoteOutput = true;
 
       for (const app of remotes.staticRemotes) {
@@ -136,7 +178,9 @@ export function executeModuleFederationDevServerBuilder(
           [
             'run',
             `${app}:serve-static${
-          context.target.configuration ? `:${context.target.configuration}` : ''
+              context.target.configuration
+                ? `:${context.target.configuration}`
+                : ''
             }`,
             ...(isUsingModuleFederationDevServerExecutor
               ? [`--isInitialHost=false`]
@@ -221,6 +265,8 @@ export function executeModuleFederationDevServerBuilder(
       return devRemotes$.length > 0
         ? combineLatest([...devRemotes$]).pipe(concatMap(() => currExecutor))
         : currExecutor;
+    })
+  );
 }
 
 export default require('@angular-devkit/architect').createBuilder(

packages/angular/src/builders/module-federation-dev-server/schema.d.ts

@@ -22,4 +22,5 @@ export interface Schema {
   pathToManifestFile?: string;
   static?: boolean;
   isInitialHost?: boolean;
+  parallel?: number;
 }

packages/angular/src/builders/module-federation-dev-server/schema.json

@@ -132,6 +132,10 @@
       "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"
     }
   },
   "additionalProperties": false,

packages/react/src/executors/module-federation-dev-server/module-federation-dev-server.impl.ts

@@ -24,6 +24,7 @@ type ModuleFederationDevServerOptions = WebDevServerOptions & {
   skipRemotes?: string[];
   static?: boolean;
   isInitialHost?: boolean;
+  parallel?: number;
 };
 
 function getBuildOptions(buildTarget: string, context: ExecutorContext) {
@@ -80,6 +81,44 @@ export default async function* moduleFederationDevServer(
     }
   );
 
+  logger.info(`NX Building ${remotes.staticRemotes.length} static remotes...`);
+  await new Promise<void>((res) => {
+    const staticProcess = fork(
+      nxBin,
+      [
+        'run-many',
+        `--target=build`,
+        `--projects=${remotes.staticRemotes.join(',')}`,
+        ...(context.configurationName
+          ? [`--configuration=${context.configurationName}`]
+          : []),
+        ...(options.parallel ? [`--parallel=${options.parallel}`] : []),
+      ],
+      {
+        cwd: context.root,
+        stdio: ['ignore', 'pipe', 'pipe', 'ipc'],
+      }
+    );
+    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, '');
+      if (stdoutString.includes('Successfully ran target build')) {
+        staticProcess.stdout.removeAllListeners('data');
+        logger.info(`NX Built ${remotes.staticRemotes.length} static remotes`);
+        res();
+      }
+    });
+    staticProcess.stderr.on('data', (data) => logger.info(data.toString()));
+    staticProcess.on('exit', (code) => {
+      if (code !== 0) {
+        throw new Error(`Remote failed to start. See above for errors.`);
+      }
+    });
+    process.on('SIGTERM', () => staticProcess.kill('SIGTERM'));
+    process.on('exit', () => staticProcess.kill('SIGTERM'));
+  });
+
   let isCollectingStaticRemoteOutput = true;
   const devRemoteIters: AsyncIterable<{ success: boolean }>[] = [];
 

packages/react/src/executors/module-federation-dev-server/schema.json

@@ -101,6 +101,10 @@
       "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"
     }
   }
 }