fix(module-federation): support buildable libs (#20786)

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

@@ -135,6 +135,11 @@
       "staticRemotesPort": {
         "type": "number",
         "description": "The port at which to serve the file-server for the static remotes."
+      },
+      "buildLibsFromSource": {
+        "type": "boolean",
+        "description": "Read buildable libraries from source instead of building them separately. If not set, it will take the value specified in the `browserTarget` options, or it will default to `true` if it's also not set in the `browserTarget` options.",
+        "x-priority": "important"
       }
     },
     "additionalProperties": false,

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

@@ -11,6 +11,7 @@ import {
   parseTargetString,
   readCachedProjectGraph,
   type Target,
+  targetToTargetString,
 } from '@nx/devkit';
 import { getRootTsConfigPath } from '@nx/js';
 import type { DependentBuildableProjectNode } from '@nx/js/src/utils/buildable-libs-utils';
@@ -82,6 +83,9 @@ export function executeDevServerBuilder(
     buildTargetOptions.buildLibsFromSource ??
     true;
 
+  process.env.NX_BUILD_LIBS_FROM_SOURCE = `${buildLibsFromSource}`;
+  process.env.NX_BUILD_TARGET = options.buildTarget;
+
   let pathToWebpackConfig: string;
   if (buildTargetOptions.customWebpackConfig?.path) {
     pathToWebpackConfig = joinPathFragments(
@@ -251,6 +255,7 @@ const executorToBuilderMap = new Map<string, string>([
   ],
   ['@nx/angular:application', '@angular-devkit/build-angular:application'],
 ]);
+
 function patchBuilderContext(
   context: BuilderContext,
   isUsingEsbuildBuilder: boolean,

packages/angular/src/builders/webpack-browser/webpack-browser.impl.ts

@@ -1,8 +1,10 @@
 import {
   joinPathFragments,
   normalizePath,
+  parseTargetString,
   ProjectGraph,
   readCachedProjectGraph,
+  targetToTargetString,
 } from '@nx/devkit';
 import type { DependentBuildableProjectNode } from '@nx/js/src/utils/buildable-libs-utils';
 import { WebpackNxBuildCoordinationPlugin } from '@nx/webpack/src/plugins/webpack-nx-build-coordination-plugin';
@@ -57,6 +59,9 @@ export function executeWebpackBrowserBuilder(
     ...delegateBuilderOptions
   } = options;
 
+  process.env.NX_BUILD_LIBS_FROM_SOURCE = `${buildLibsFromSource}`;
+  process.env.NX_BUILD_TARGET = targetToTargetString({ ...context.target });
+
   const pathToWebpackConfig =
     customWebpackConfig?.path &&
     joinPathFragments(context.workspaceRoot, customWebpackConfig.path);

packages/angular/src/builders/webpack-server/webpack-server.impl.ts

@@ -1,4 +1,8 @@
-import { joinPathFragments, normalizePath } from '@nx/devkit';
+import {
+  joinPathFragments,
+  normalizePath,
+  targetToTargetString,
+} from '@nx/devkit';
 import { existsSync } from 'fs';
 import { relative } from 'path';
 import { Observable, from } from 'rxjs';
@@ -96,6 +100,9 @@ export function executeWebpackServerBuilder(
 
   options.buildLibsFromSource ??= true;
 
+  process.env.NX_BUILD_LIBS_FROM_SOURCE = `${options.buildLibsFromSource}`;
+  process.env.NX_BUILD_TARGET = targetToTargetString({ ...context.target });
+
   if (!options.buildLibsFromSource) {
     const { tsConfigPath } = createTmpTsConfigForBuildableLibs(
       options.tsConfig,

packages/angular/src/executors/module-federation-dev-server/lib/normalize-options.ts

@@ -11,6 +11,9 @@ export function normalizeOptions(schema: Schema): NormalizedSchema {
     buildTarget ??= (schema as SchemaWithBrowserTarget).browserTarget;
     delete (schema as SchemaWithBrowserTarget).browserTarget;
   }
+  schema.buildLibsFromSource ??= true;
+  process.env.NX_BUILD_LIBS_FROM_SOURCE = `${schema.buildLibsFromSource}`;
+  process.env.NX_BUILD_TARGET = `${buildTarget}`;
 
   return {
     ...schema,

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

@@ -23,6 +23,7 @@ interface BaseSchema {
   isInitialHost?: boolean;
   parallel?: number;
   staticRemotesPort?: number;
+  buildLibsFromSource?: boolean;
 }
 
 export type SchemaWithBrowserTarget = BaseSchema & {

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

@@ -145,6 +145,11 @@
     "staticRemotesPort": {
       "type": "number",
       "description": "The port at which to serve the file-server for the static remotes."
+    },
+    "buildLibsFromSource": {
+      "type": "boolean",
+      "description": "Read buildable libraries from source instead of building them separately. If not set, it will take the value specified in the `browserTarget` options, or it will default to `true` if it's also not set in the `browserTarget` options.",
+      "x-priority": "important"
     }
   },
   "additionalProperties": false,

packages/webpack/src/executors/dev-server/dev-server.impl.ts

@@ -3,6 +3,7 @@ import {
   ExecutorContext,
   parseTargetString,
   readTargetOptions,
+  targetToTargetString,
 } from '@nx/devkit';
 
 import { eachValueFrom } from '@nx/devkit/src/utils/rxjs-for-await';
@@ -38,6 +39,9 @@ export async function* devServerExecutor(
     sourceRoot
   );
 
+  process.env.NX_BUILD_LIBS_FROM_SOURCE = `${buildOptions.buildLibsFromSource}`;
+  process.env.NX_BUILD_TARGET = serveOptions.buildTarget;
+
   // TODO(jack): Figure out a way to port this into NxWebpackPlugin
   if (!buildOptions.buildLibsFromSource) {
     if (!buildOptions.tsConfig) {
@@ -59,6 +63,8 @@ export async function* devServerExecutor(
       target.data.root,
       dependencies
     );
+
+    process.env.NX_TSCONFIG_PATH = buildOptions.tsConfig;
   }
 
   let config;

packages/webpack/src/executors/webpack/webpack.impl.ts

@@ -1,4 +1,9 @@
-import { ExecutorContext, logger, stripIndents } from '@nx/devkit';
+import {
+  ExecutorContext,
+  logger,
+  stripIndents,
+  targetToTargetString,
+} from '@nx/devkit';
 import { eachValueFrom } from '@nx/devkit/src/utils/rxjs-for-await';
 import type { Configuration, Stats } from 'webpack';
 import { from, of } from 'rxjs';
@@ -116,6 +121,13 @@ export async function* webpackExecutor(
     ? 'production'
     : 'development';
 
+  process.env.NX_BUILD_LIBS_FROM_SOURCE = `${options.buildLibsFromSource}`;
+  process.env.NX_BUILD_TARGET = targetToTargetString({
+    project: context.projectName,
+    target: context.targetName,
+    configuration: context.configurationName,
+  });
+
   if (options.compiler === 'swc') {
     try {
       require.resolve('swc-loader');
@@ -146,6 +158,7 @@ export async function* webpackExecutor(
       metadata.root,
       dependencies
     );
+    process.env.NX_TSCONFIG_PATH = options.tsConfig;
   }
 
   // Delete output path before bundling

packages/webpack/src/utils/module-federation/dependencies.ts

@@ -1,6 +1,11 @@
 import type { ProjectGraph } from '@nx/devkit';
 import type { WorkspaceLibrary } from './models';
 import { readTsPathMappings } from './typescript';
+import {
+  getOutputsForTargetAndConfiguration,
+  parseTargetString,
+} from '@nx/devkit';
+import { interpolate } from 'nx/src/tasks-runner/utils';
 
 export function getDependentPackagesForProject(
   projectGraph: ProjectGraph,
@@ -57,12 +62,32 @@ function getLibraryImportPath(
   library: string,
   projectGraph: ProjectGraph
 ): string | undefined {
+  let buildLibsFromSource = true;
+  if (process.env.NX_BUILD_LIBS_FROM_SOURCE) {
+    buildLibsFromSource = process.env.NX_BUILD_LIBS_FROM_SOURCE === 'true';
+  }
+  const libraryNode = projectGraph.nodes[library];
+  let sourceRoots = [libraryNode.data.sourceRoot];
+
+  if (!buildLibsFromSource && process.env.NX_BUILD_TARGET) {
+    const buildTarget = parseTargetString(
+      process.env.NX_BUILD_TARGET,
+      projectGraph
+    );
+    sourceRoots = getOutputsForTargetAndConfiguration(
+      buildTarget,
+      {},
+      libraryNode
+    );
+  }
+
   const tsConfigPathMappings = readTsPathMappings();
 
-  const sourceRoot = projectGraph.nodes[library].data.sourceRoot;
   for (const [key, value] of Object.entries(tsConfigPathMappings)) {
-    if (value.find((path) => path.startsWith(sourceRoot))) {
+    for (const src of sourceRoots) {
-      return key;
+      if (value.find((path) => path.startsWith(src))) {
+        return key;
+      }
     }
   }