@nx/module-federation 21.1.2 → 21.2.0-beta.2

package/README.md

@@ -1,7 +1,7 @@
 <p style="text-align: center;">
   <picture>
     <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/nrwl/nx/master/images/nx-dark.svg">
-    <img alt="Nx - Smart Monorepos · Fast CI" src="https://raw.githubusercontent.com/nrwl/nx/master/images/nx-light.svg" width="100%">
+    <img alt="Nx - Smart Repos · Fast Builds" src="https://raw.githubusercontent.com/nrwl/nx/master/images/nx-light.svg" width="100%">
   </picture>
 </p>
 
@@ -20,9 +20,9 @@
 
 <hr>
 
-# Nx: Smart Monorepos · Fast CI
+# Nx: Smart Repos · Fast Builds
 
-Nx is a build system, optimized for monorepos, with plugins for popular frameworks and tools and advanced CI capabilities including caching and distribution.
+An AI-first build platform that connects everything from your editor to CI. Helping you deliver fast, without breaking things.
 
 This package is a [Module Federation plugin for Nx](https://nx.dev/nx-api/module-federation).
 Module Federation allows developers to share code between deployed applications easier and makes team collaboration more efficient.  
@@ -66,5 +66,5 @@ npx nx@latest init
 - [Blog Posts About Nx](https://nx.dev/blog)
 
 <p style="text-align: center;"><a href="https://nx.dev/#learning-materials" target="_blank" rel="noreferrer"><img src="https://raw.githubusercontent.com/nrwl/nx/master/images/nx-courses-and-videos.svg" 
-width="100%" alt="Nx - Smart Monorepos · Fast CI"></a></p>
+width="100%" alt="Nx - Smart Repos · Fast Builds"></a></p>
 

package/angular.d.ts

@@ -1,2 +1,5 @@
 export * from './src/with-module-federation/angular/with-module-federation';
 export * from './src/with-module-federation/angular/with-module-federation-ssr';
+export * from './src/plugins/nx-module-federation-plugin/angular/nx-module-federation-plugin';
+export * from './src/plugins/nx-module-federation-plugin/angular/nx-module-federation-dev-server-plugin';
+export * from './src/plugins/nx-module-federation-plugin/angular/nx-module-federation-ssr-dev-server-plugin';

package/angular.js

@@ -3,3 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./src/with-module-federation/angular/with-module-federation"), exports);
 tslib_1.__exportStar(require("./src/with-module-federation/angular/with-module-federation-ssr"), exports);
+tslib_1.__exportStar(require("./src/plugins/nx-module-federation-plugin/angular/nx-module-federation-plugin"), exports);
+tslib_1.__exportStar(require("./src/plugins/nx-module-federation-plugin/angular/nx-module-federation-dev-server-plugin"), exports);
+tslib_1.__exportStar(require("./src/plugins/nx-module-federation-plugin/angular/nx-module-federation-ssr-dev-server-plugin"), exports);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nx/module-federation",
   "description": "The Nx Plugin for Module Federation contains executors and utilities that support building applications using Module Federation.",
-  "version": "21.1.2",
+  "version": "21.2.0-beta.2",
   "type": "commonjs",
   "repository": {
     "type": "git",
@@ -25,9 +25,9 @@
   "executors": "./executors.json",
   "dependencies": {
     "tslib": "^2.3.0",
-    "@nx/devkit": "21.1.2",
-    "@nx/js": "21.1.2",
-    "@nx/web": "21.1.2",
+    "@nx/devkit": "21.2.0-beta.2",
+    "@nx/js": "21.2.0-beta.2",
+    "@nx/web": "21.2.0-beta.2",
     "picocolors": "^1.1.0",
     "webpack": "^5.88.0",
     "@rspack/core": "^1.3.8",

package/src/plugins/nx-module-federation-plugin/angular/nx-module-federation-dev-server-plugin.d.ts

@@ -0,0 +1,13 @@
+import { Compiler, RspackPluginInstance } from '@rspack/core';
+import { ModuleFederationConfig } from '../../../utils/models';
+import { NxModuleFederationDevServerConfig } from '../../models';
+export declare class NxModuleFederationDevServerPlugin implements RspackPluginInstance {
+    private _options;
+    private nxBin;
+    constructor(_options: {
+        config: ModuleFederationConfig;
+        devServerConfig?: NxModuleFederationDevServerConfig;
+    });
+    apply(compiler: Compiler): void;
+    private setup;
+}

package/src/plugins/nx-module-federation-plugin/angular/nx-module-federation-dev-server-plugin.js

@@ -0,0 +1,72 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NxModuleFederationDevServerPlugin = void 0;
+const core_1 = require("@rspack/core");
+const pc = require("picocolors");
+const devkit_1 = require("@nx/devkit");
+const path_1 = require("path");
+const fs_1 = require("fs");
+const utils_1 = require("../../utils");
+const PLUGIN_NAME = 'NxModuleFederationDevServerPlugin';
+class NxModuleFederationDevServerPlugin {
+    constructor(_options) {
+        this._options = _options;
+        this.nxBin = require.resolve('nx/bin/nx');
+        this._options.devServerConfig ??= {
+            host: 'localhost',
+        };
+    }
+    apply(compiler) {
+        const isDevServer = process.env['WEBPACK_SERVE'];
+        if (!isDevServer) {
+            return;
+        }
+        compiler.hooks.watchRun.tapAsync(PLUGIN_NAME, async (compiler, callback) => {
+            compiler.hooks.beforeCompile.tapAsync(PLUGIN_NAME, async (params, callback) => {
+                const staticRemotesConfig = await this.setup();
+                devkit_1.logger.info(`NX Starting module federation dev-server for ${pc.bold(this._options.config.name)} with ${Object.keys(staticRemotesConfig).length} remotes`);
+                const mappedLocationOfRemotes = await (0, utils_1.buildStaticRemotes)(staticRemotesConfig, this._options.devServerConfig, this.nxBin);
+                (0, utils_1.startStaticRemotesFileServer)(staticRemotesConfig, devkit_1.workspaceRoot, this._options.devServerConfig.staticRemotesPort);
+                (0, utils_1.startRemoteProxies)(staticRemotesConfig, mappedLocationOfRemotes, {
+                    pathToCert: this._options.devServerConfig.sslCert,
+                    pathToKey: this._options.devServerConfig.sslCert,
+                });
+                new core_1.DefinePlugin({
+                    'process.env.NX_MF_DEV_REMOTES': process.env.NX_MF_DEV_REMOTES,
+                }).apply(compiler);
+                callback();
+            });
+            callback();
+        });
+    }
+    async setup() {
+        const projectGraph = (0, devkit_1.readCachedProjectGraph)();
+        const { projects: workspaceProjects } = (0, devkit_1.readProjectsConfigurationFromProjectGraph)(projectGraph);
+        const project = workspaceProjects[this._options.config.name];
+        if (!this._options.devServerConfig.pathToManifestFile) {
+            this._options.devServerConfig.pathToManifestFile =
+                (0, utils_1.getDynamicMfManifestFile)(project, devkit_1.workspaceRoot);
+        }
+        else {
+            const userPathToManifestFile = (0, path_1.join)(devkit_1.workspaceRoot, this._options.devServerConfig.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)(this._options.devServerConfig.pathToManifestFile) !== '.json') {
+                throw new Error(`The Module Federation manifest file must be a JSON. Please ensure the file at ${userPathToManifestFile} is a JSON.`);
+            }
+            this._options.devServerConfig.pathToManifestFile = userPathToManifestFile;
+        }
+        const { remotes, staticRemotePort } = (0, utils_1.getRemotes)(this._options.config, projectGraph, this._options.devServerConfig.pathToManifestFile);
+        this._options.devServerConfig.staticRemotesPort ??= staticRemotePort;
+        const remotesConfig = (0, utils_1.parseRemotesConfig)(remotes, devkit_1.workspaceRoot, projectGraph);
+        const staticRemotesConfig = await (0, utils_1.getStaticRemotes)(remotesConfig.config ?? {}, this._options.devServerConfig?.devRemoteFindOptions, this._options.devServerConfig?.host);
+        const devRemotes = remotes.filter((r) => !staticRemotesConfig[r]);
+        process.env.NX_MF_DEV_REMOTES = JSON.stringify([
+            ...(devRemotes.length > 0 ? devRemotes : []),
+            project.name,
+        ]);
+        return staticRemotesConfig ?? {};
+    }
+}
+exports.NxModuleFederationDevServerPlugin = NxModuleFederationDevServerPlugin;

package/src/plugins/nx-module-federation-plugin/angular/nx-module-federation-plugin.d.ts

@@ -0,0 +1,11 @@
+import { Compiler, RspackPluginInstance } from '@rspack/core';
+import { ModuleFederationConfig, NxModuleFederationConfigOverride } from '../../../utils/models';
+export declare class NxModuleFederationPlugin implements RspackPluginInstance {
+    private _options;
+    private configOverride?;
+    constructor(_options: {
+        config: ModuleFederationConfig;
+        isServer?: boolean;
+    }, configOverride?: NxModuleFederationConfigOverride);
+    apply(compiler: Compiler): void;
+}

package/src/plugins/nx-module-federation-plugin/angular/nx-module-federation-plugin.js

@@ -0,0 +1,70 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NxModuleFederationPlugin = void 0;
+const utils_1 = require("../../../with-module-federation/angular/utils");
+class NxModuleFederationPlugin {
+    constructor(_options, configOverride) {
+        this._options = _options;
+        this.configOverride = configOverride;
+    }
+    apply(compiler) {
+        if (global.NX_GRAPH_CREATION) {
+            return;
+        }
+        // This is required to ensure Module Federation will build the project correctly
+        compiler.options.optimization ??= {};
+        compiler.options.optimization.runtimeChunk = false;
+        compiler.options.output.publicPath = !compiler.options.output.publicPath
+            ? 'auto'
+            : compiler.options.output.publicPath;
+        compiler.options.output.uniqueName = this._options.config.name;
+        if (compiler.options.output.scriptType === 'module') {
+            compiler.options.output.scriptType = undefined;
+            compiler.options.output.module = undefined;
+        }
+        if (this._options.isServer) {
+            compiler.options.target = 'async-node';
+            compiler.options.output.library ??= {
+                type: 'commonjs-module',
+            };
+            compiler.options.output.library.type = 'commonjs-module';
+        }
+        const config = (0, utils_1.getModuleFederationConfigSync)(this._options.config, {
+            isServer: this._options.isServer,
+        }, true);
+        const sharedLibraries = config.sharedLibraries;
+        const sharedDependencies = config.sharedDependencies;
+        const mappedRemotes = config.mappedRemotes;
+        const runtimePlugins = [];
+        if (this.configOverride?.runtimePlugins) {
+            runtimePlugins.push(...(this.configOverride.runtimePlugins ?? []));
+        }
+        if (this._options.isServer) {
+            runtimePlugins.push(require.resolve('@module-federation/node/runtimePlugin'));
+        }
+        new (require('@module-federation/enhanced/rspack').ModuleFederationPlugin)({
+            name: this._options.config.name.replace(/-/g, '_'),
+            filename: 'remoteEntry.js',
+            exposes: this._options.config.exposes,
+            remotes: mappedRemotes,
+            shared: {
+                ...(sharedDependencies ?? {}),
+            },
+            ...(this._options.isServer
+                ? {
+                    library: {
+                        type: 'commonjs-module',
+                    },
+                    remoteType: 'script',
+                }
+                : {}),
+            ...(this.configOverride ? this.configOverride : {}),
+            runtimePlugins,
+            virtualRuntimeEntry: true,
+        }).apply(compiler);
+        if (sharedLibraries) {
+            sharedLibraries.getReplacementPlugin().apply(compiler);
+        }
+    }
+}
+exports.NxModuleFederationPlugin = NxModuleFederationPlugin;

package/src/plugins/nx-module-federation-plugin/angular/nx-module-federation-ssr-dev-server-plugin.d.ts

@@ -0,0 +1,15 @@
+import { Compiler, RspackPluginInstance } from '@rspack/core';
+import { ModuleFederationConfig } from '../../../utils/models';
+import { NxModuleFederationDevServerConfig } from '../../models';
+export declare class NxModuleFederationSSRDevServerPlugin implements RspackPluginInstance {
+    private _options;
+    private devServerProcess;
+    private nxBin;
+    constructor(_options: {
+        config: ModuleFederationConfig;
+        devServerConfig?: NxModuleFederationDevServerConfig;
+    });
+    apply(compiler: Compiler): void;
+    private startServer;
+    private setup;
+}

package/src/plugins/nx-module-federation-plugin/angular/nx-module-federation-ssr-dev-server-plugin.js

@@ -0,0 +1,107 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NxModuleFederationSSRDevServerPlugin = void 0;
+const core_1 = require("@rspack/core");
+const pc = require("picocolors");
+const devkit_1 = require("@nx/devkit");
+const path_1 = require("path");
+const fs_1 = require("fs");
+const utils_1 = require("../../utils");
+const node_child_process_1 = require("node:child_process");
+const PLUGIN_NAME = 'NxModuleFederationSSRDevServerPlugin';
+class NxModuleFederationSSRDevServerPlugin {
+    constructor(_options) {
+        this._options = _options;
+        this.nxBin = require.resolve('nx/bin/nx');
+        this._options.devServerConfig ??= {
+            host: 'localhost',
+        };
+    }
+    apply(compiler) {
+        const isDevServer = process.env['WEBPACK_SERVE'];
+        if (!isDevServer) {
+            return;
+        }
+        compiler.hooks.watchRun.tapAsync(PLUGIN_NAME, async (compiler, callback) => {
+            compiler.hooks.beforeCompile.tapAsync(PLUGIN_NAME, async (params, callback) => {
+                const staticRemotesConfig = await this.setup(compiler);
+                devkit_1.logger.info(`NX Starting module federation dev-server for ${pc.bold(this._options.config.name)} with ${Object.keys(staticRemotesConfig).length} remotes`);
+                const mappedLocationOfRemotes = await (0, utils_1.buildStaticRemotes)(staticRemotesConfig, this._options.devServerConfig, this.nxBin);
+                (0, utils_1.startStaticRemotesFileServer)(staticRemotesConfig, devkit_1.workspaceRoot, this._options.devServerConfig.staticRemotesPort);
+                (0, utils_1.startRemoteProxies)(staticRemotesConfig, mappedLocationOfRemotes, {
+                    pathToCert: this._options.devServerConfig.sslCert,
+                    pathToKey: this._options.devServerConfig.sslCert,
+                }, true);
+                new core_1.DefinePlugin({
+                    'process.env.NX_MF_DEV_REMOTES': process.env.NX_MF_DEV_REMOTES,
+                }).apply(compiler);
+                await this.startServer(compiler);
+                callback();
+            });
+            callback();
+        });
+    }
+    async startServer(compiler) {
+        compiler.hooks.done.tapAsync(PLUGIN_NAME, async (_, callback) => {
+            const serverPath = (0, path_1.join)(compiler.options.output.path, compiler.options.output.filename ?? 'server.js');
+            if (this.devServerProcess) {
+                await new Promise((res) => {
+                    this.devServerProcess.on('exit', () => {
+                        res();
+                    });
+                    this.devServerProcess.kill('SIGKILL');
+                    this.devServerProcess = undefined;
+                });
+            }
+            if (!(0, fs_1.existsSync)(serverPath)) {
+                for (let retries = 0; retries < 10; retries++) {
+                    await new Promise((res) => setTimeout(res, 200));
+                    if ((0, fs_1.existsSync)(serverPath)) {
+                        break;
+                    }
+                }
+                if (!(0, fs_1.existsSync)(serverPath)) {
+                    throw new Error(`Could not find server bundle at ${serverPath}.`);
+                }
+            }
+            this.devServerProcess = (0, node_child_process_1.fork)(serverPath);
+            process.on('exit', () => {
+                this.devServerProcess?.kill('SIGKILL');
+            });
+            process.on('SIGINT', () => {
+                this.devServerProcess?.kill('SIGKILL');
+            });
+            callback();
+        });
+    }
+    async setup(compiler) {
+        const projectGraph = (0, devkit_1.readCachedProjectGraph)();
+        const { projects: workspaceProjects } = (0, devkit_1.readProjectsConfigurationFromProjectGraph)(projectGraph);
+        const project = workspaceProjects[this._options.config.name];
+        if (!this._options.devServerConfig.pathToManifestFile) {
+            this._options.devServerConfig.pathToManifestFile =
+                (0, utils_1.getDynamicMfManifestFile)(project, devkit_1.workspaceRoot);
+        }
+        else {
+            const userPathToManifestFile = (0, path_1.join)(devkit_1.workspaceRoot, this._options.devServerConfig.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)(this._options.devServerConfig.pathToManifestFile) !== '.json') {
+                throw new Error(`The Module Federation manifest file must be a JSON. Please ensure the file at ${userPathToManifestFile} is a JSON.`);
+            }
+            this._options.devServerConfig.pathToManifestFile = userPathToManifestFile;
+        }
+        const { remotes, staticRemotePort } = (0, utils_1.getRemotes)(this._options.config, projectGraph, this._options.devServerConfig.pathToManifestFile);
+        this._options.devServerConfig.staticRemotesPort ??= staticRemotePort;
+        const remotesConfig = (0, utils_1.parseRemotesConfig)(remotes, devkit_1.workspaceRoot, projectGraph, true);
+        const staticRemotesConfig = await (0, utils_1.getStaticRemotes)(remotesConfig.config ?? {});
+        const devRemotes = remotes.filter((r) => !staticRemotesConfig[r]);
+        process.env.NX_MF_DEV_REMOTES = JSON.stringify([
+            ...(devRemotes.length > 0 ? devRemotes : []),
+            project.name,
+        ]);
+        return staticRemotesConfig ?? {};
+    }
+}
+exports.NxModuleFederationSSRDevServerPlugin = NxModuleFederationSSRDevServerPlugin;

package/src/plugins/nx-module-federation-plugin/rspack/nx-module-federation-dev-server-plugin.js

@@ -60,7 +60,7 @@ class NxModuleFederationDevServerPlugin {
         const { remotes, staticRemotePort } = (0, utils_1.getRemotes)(this._options.config, projectGraph, this._options.devServerConfig.pathToManifestFile);
         this._options.devServerConfig.staticRemotesPort ??= staticRemotePort;
         const remotesConfig = (0, utils_1.parseRemotesConfig)(remotes, devkit_1.workspaceRoot, projectGraph);
-        const staticRemotesConfig = await (0, utils_1.getStaticRemotes)(remotesConfig.config ?? {});
+        const staticRemotesConfig = await (0, utils_1.getStaticRemotes)(remotesConfig.config ?? {}, this._options.devServerConfig?.devRemoteFindOptions, this._options.devServerConfig?.host);
         const devRemotes = remotes.filter((r) => !staticRemotesConfig[r]);
         process.env.NX_MF_DEV_REMOTES = JSON.stringify([
             ...(devRemotes.length > 0 ? devRemotes : []),

package/src/plugins/utils/build-static-remotes.js

@@ -13,7 +13,7 @@ async function buildStaticRemotes(staticRemotesConfig, options, nxBin) {
     }
     const mappedLocationOfRemotes = {};
     for (const app of remotes) {
-        mappedLocationOfRemotes[app] = `http${options.ssl ? 's' : ''}://${options.host}:${options.staticRemotesPort}/${staticRemotesConfig[app].urlSegment}`;
+        mappedLocationOfRemotes[app] = `http${options.ssl ? 's' : ''}://${options.host ?? 'localhost'}:${options.staticRemotesPort}/${staticRemotesConfig[app].urlSegment}`;
     }
     await new Promise((res, rej) => {
         console.log(`NX Building ${remotes.length} static remotes...`);

package/src/plugins/utils/get-static-remotes.d.ts

@@ -1,3 +1,3 @@
 import { StaticRemoteConfig } from '../../utils';
 import { DevRemoteFindOptions } from '../models';
-export declare function getStaticRemotes(remotesConfig: Record<string, StaticRemoteConfig>, devRemoteFindOptions?: DevRemoteFindOptions): Promise<Record<string, StaticRemoteConfig>>;
+export declare function getStaticRemotes(remotesConfig: Record<string, StaticRemoteConfig>, devRemoteFindOptions?: DevRemoteFindOptions, host?: string): Promise<Record<string, StaticRemoteConfig>>;

package/src/plugins/utils/get-static-remotes.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getStaticRemotes = getStaticRemotes;
 const wait_for_port_open_1 = require("@nx/web/src/utils/wait-for-port-open");
-async function getStaticRemotes(remotesConfig, devRemoteFindOptions) {
+async function getStaticRemotes(remotesConfig, devRemoteFindOptions, host = '127.0.0.1') {
     const remotes = Object.keys(remotesConfig);
     const findStaticRemotesPromises = [];
     for (const remote of remotes) {
@@ -10,6 +10,7 @@ async function getStaticRemotes(remotesConfig, devRemoteFindOptions) {
             (0, wait_for_port_open_1.waitForPortOpen)(remotesConfig[remote].port, {
                 retries: devRemoteFindOptions?.retries ?? 3,
                 retryDelay: devRemoteFindOptions?.retryDelay ?? 1000,
+                host,
             }).then((res) => {
                 resolve(undefined);
             }, (rej) => {

package/src/utils/remotes.js

@@ -27,30 +27,22 @@ function mapRemotes(remotes, remoteEntryExt, determineRemoteUrl, isRemoteGlobal
 }
 // Helper function to deal with remotes that are arrays
 function handleArrayRemote(remote, remoteEntryExt, isRemoteGlobal) {
-    let [nxRemoteProjectName, remoteLocation] = remote;
+    const [nxRemoteProjectName, remoteLocation] = remote;
     const mfRemoteName = normalizeRemoteName(nxRemoteProjectName);
-    const remoteLocationExt = (0, path_1.extname)(remoteLocation);
-    // If remote location already has .js or .mjs extension
-    if (['.js', '.mjs', '.json'].includes(remoteLocationExt)) {
-        if (isRemoteGlobal && !remoteLocation.startsWith(`${mfRemoteName}@`)) {
-            return `${mfRemoteName}@${remoteLocation}`;
-        }
+    // Remote string starts like "promise new Promise(...)" – return as-is
+    if (remoteLocation.startsWith('promise new Promise')) {
         return remoteLocation;
     }
-    const baseRemote = remoteLocation.endsWith('/')
-        ? remoteLocation.slice(0, -1)
-        : remoteLocation;
-    const globalPrefix = isRemoteGlobal
-        ? `${normalizeRemoteName(nxRemoteProjectName)}@`
-        : '';
-    // if the remote is defined with anything other than http then we assume it's a promise based remote
-    // In that case we should use what the user provides as the remote location
-    if (!remoteLocation.startsWith('promise new Promise')) {
-        return `${globalPrefix}${baseRemote}/remoteEntry.${remoteEntryExt}`;
-    }
-    else {
-        return remoteLocation;
+    const resolvedUrl = new URL(remoteLocation);
+    const ext = (0, path_1.extname)(resolvedUrl.pathname);
+    const needsRemoteEntry = !['.js', '.mjs', '.json'].includes(ext);
+    if (needsRemoteEntry) {
+        resolvedUrl.pathname = resolvedUrl.pathname.endsWith('/')
+            ? `${resolvedUrl.pathname}remoteEntry.${remoteEntryExt}`
+            : `${resolvedUrl.pathname}/remoteEntry.${remoteEntryExt}`;
     }
+    const finalRemoteUrl = resolvedUrl.href;
+    return isRemoteGlobal ? `${mfRemoteName}@${finalRemoteUrl}` : finalRemoteUrl;
 }
 // Helper function to deal with remotes that are strings
 function handleStringRemote(nxRemoteProjectName, determineRemoteUrl, isRemoteGlobal) {
@@ -73,12 +65,16 @@ function mapRemotesForSSR(remotes, remoteEntryExt, determineRemoteUrl) {
         if (Array.isArray(remote)) {
             let [nxRemoteProjectName, remoteLocation] = remote;
             const mfRemoteName = normalizeRemoteName(nxRemoteProjectName);
-            const remoteLocationExt = (0, path_1.extname)(remoteLocation);
-            mappedRemotes[mfRemoteName] = `${mfRemoteName}@${['.js', '.mjs', '.json'].includes(remoteLocationExt)
-                ? remoteLocation
-                : `${remoteLocation.endsWith('/')
-                    ? remoteLocation.slice(0, -1)
-                    : remoteLocation}/remoteEntry.${remoteEntryExt}`}`;
+            const resolvedUrl = new URL(remoteLocation);
+            const remoteLocationExt = (0, path_1.extname)(resolvedUrl.pathname);
+            const needsRemoteEntry = !['.js', '.mjs', '.json'].includes(remoteLocationExt);
+            if (needsRemoteEntry) {
+                resolvedUrl.pathname = resolvedUrl.pathname.endsWith('/')
+                    ? `${resolvedUrl.pathname}remoteEntry.${remoteEntryExt}`
+                    : `${resolvedUrl.pathname}/remoteEntry.${remoteEntryExt}`;
+            }
+            const finalRemoteUrl = resolvedUrl.href;
+            mappedRemotes[mfRemoteName] = `${mfRemoteName}@${finalRemoteUrl}`;
         }
         else if (typeof remote === 'string') {
             const mfRemoteName = normalizeRemoteName(remote);

package/src/with-module-federation/angular/utils.d.ts

@@ -1,8 +1,8 @@
 import { ModuleFederationConfig, SharedLibraryConfig } from '../../utils';
-export declare function applyDefaultEagerPackages(sharedConfig: Record<string, SharedLibraryConfig>): void;
+export declare function applyDefaultEagerPackages(sharedConfig: Record<string, SharedLibraryConfig>, useRspack?: boolean): void;
 export declare const DEFAULT_NPM_PACKAGES_TO_AVOID: string[];
 export declare const DEFAULT_ANGULAR_PACKAGES_TO_SHARE: string[];
-export declare function getFunctionDeterminateRemoteUrl(isServer?: boolean): (remote: string) => string;
+export declare function getFunctionDeterminateRemoteUrl(isServer?: boolean, useRspack?: boolean): (remote: string) => string;
 export declare function getModuleFederationConfig(mfConfig: ModuleFederationConfig, options?: {
     isServer: boolean;
     determineRemoteUrl?: (remote: string) => string;
@@ -13,3 +13,13 @@ export declare function getModuleFederationConfig(mfConfig: ModuleFederationConf
     };
     mappedRemotes: Record<string, string>;
 }>;
+export declare function getModuleFederationConfigSync(mfConfig: ModuleFederationConfig, options?: {
+    isServer: boolean;
+    determineRemoteUrl?: (remote: string) => string;
+}, useRspack?: boolean): {
+    sharedLibraries: import("../../utils").SharedWorkspaceLibraryConfig;
+    sharedDependencies: {
+        [x: string]: SharedLibraryConfig;
+    };
+    mappedRemotes: Record<string, string>;
+};

package/src/with-module-federation/angular/utils.js

@@ -4,13 +4,25 @@ exports.DEFAULT_ANGULAR_PACKAGES_TO_SHARE = exports.DEFAULT_NPM_PACKAGES_TO_AVOI
 exports.applyDefaultEagerPackages = applyDefaultEagerPackages;
 exports.getFunctionDeterminateRemoteUrl = getFunctionDeterminateRemoteUrl;
 exports.getModuleFederationConfig = getModuleFederationConfig;
+exports.getModuleFederationConfigSync = getModuleFederationConfigSync;
 const utils_1 = require("../../utils");
 const devkit_1 = require("@nx/devkit");
 const project_graph_1 = require("nx/src/project-graph/project-graph");
-function applyDefaultEagerPackages(sharedConfig) {
+function applyDefaultEagerPackages(sharedConfig, useRspack = false) {
     const DEFAULT_PACKAGES_TO_LOAD_EAGERLY = [
         '@angular/localize',
         '@angular/localize/init',
+        ...(useRspack
+            ? [
+                '@angular/core',
+                '@angular/core/primitives/signals',
+                '@angular/core/event-dispatch',
+                '@angular/core/rxjs-interop',
+                '@angular/common',
+                '@angular/common/http',
+                '@angular/platform-browser',
+            ]
+            : []),
     ];
     for (const pkg of DEFAULT_PACKAGES_TO_LOAD_EAGERLY) {
         if (!sharedConfig[pkg]) {
@@ -23,15 +35,20 @@ exports.DEFAULT_NPM_PACKAGES_TO_AVOID = [
     'zone.js',
     '@nx/angular/mf',
     '@nrwl/angular/mf',
+    '@nx/angular-rspack',
 ];
 exports.DEFAULT_ANGULAR_PACKAGES_TO_SHARE = [
     '@angular/core',
     '@angular/animations',
     '@angular/common',
 ];
-function getFunctionDeterminateRemoteUrl(isServer = false) {
+function getFunctionDeterminateRemoteUrl(isServer = false, useRspack = false) {
     const target = 'serve';
-    const remoteEntry = isServer ? 'server/remoteEntry.js' : 'remoteEntry.mjs';
+    const remoteEntry = isServer
+        ? 'server/remoteEntry.js'
+        : useRspack
+            ? 'remoteEntry.js'
+            : 'remoteEntry.mjs';
     return function (remote) {
         const mappedStaticRemotesFromEnv = process.env
             .NX_MF_DEV_SERVER_STATIC_REMOTES
@@ -55,7 +72,7 @@ function getFunctionDeterminateRemoteUrl(isServer = false) {
         const host = serveTarget.options?.host ??
             `http${serveTarget.options.ssl ? 's' : ''}://localhost`;
         const port = serveTarget.options?.port ?? 4201;
-        return `${host.endsWith('/') ? host.slice(0, -1) : host}:${port}/${remoteEntry}`;
+        return `${useRspack ? `${remote}@` : ''}${host.endsWith('/') ? host.slice(0, -1) : host}:${port}/${remoteEntry}`;
     };
 }
 async function getModuleFederationConfig(mfConfig, options = { isServer: false }) {
@@ -99,3 +116,37 @@ async function getModuleFederationConfig(mfConfig, options = { isServer: false }
         : mapRemotesFunction(mfConfig.remotes, 'mjs', determineRemoteUrlFn);
     return { sharedLibraries, sharedDependencies, mappedRemotes };
 }
+function getModuleFederationConfigSync(mfConfig, options = { isServer: false }, useRspack = false) {
+    const projectGraph = (0, devkit_1.readCachedProjectGraph)();
+    if (!projectGraph.nodes[mfConfig.name]?.data) {
+        throw Error(`Cannot find project "${mfConfig.name}". Check that the name is correct in module-federation.config.js`);
+    }
+    const dependencies = (0, utils_1.getDependentPackagesForProject)(projectGraph, mfConfig.name);
+    if (mfConfig.shared) {
+        dependencies.workspaceLibraries = dependencies.workspaceLibraries.filter((lib) => mfConfig.shared(lib.importKey, {}) !== false);
+        dependencies.npmPackages = dependencies.npmPackages.filter((pkg) => mfConfig.shared(pkg, {}) !== false);
+    }
+    const sharedLibraries = (0, utils_1.shareWorkspaceLibraries)(dependencies.workspaceLibraries);
+    const npmPackages = (0, utils_1.sharePackages)(Array.from(new Set([
+        ...dependencies.npmPackages.filter((pkg) => !exports.DEFAULT_NPM_PACKAGES_TO_AVOID.includes(pkg)),
+    ])));
+    exports.DEFAULT_NPM_PACKAGES_TO_AVOID.forEach((pkgName) => {
+        if (pkgName in npmPackages) {
+            delete npmPackages[pkgName];
+        }
+    });
+    const sharedDependencies = {
+        ...sharedLibraries.getLibraries(projectGraph.nodes[mfConfig.name].data.root),
+        ...npmPackages,
+    };
+    applyDefaultEagerPackages(sharedDependencies, useRspack);
+    (0, utils_1.applySharedFunction)(sharedDependencies, mfConfig.shared);
+    (0, utils_1.applyAdditionalShared)(sharedDependencies, mfConfig.additionalShared, projectGraph);
+    const determineRemoteUrlFn = options.determineRemoteUrl ||
+        getFunctionDeterminateRemoteUrl(options.isServer, useRspack);
+    const mapRemotesFunction = options.isServer ? utils_1.mapRemotesForSSR : utils_1.mapRemotes;
+    const mappedRemotes = !mfConfig.remotes || mfConfig.remotes.length === 0
+        ? {}
+        : mapRemotesFunction(mfConfig.remotes, useRspack ? 'js' : 'mjs', determineRemoteUrlFn);
+    return { sharedLibraries, sharedDependencies, mappedRemotes };
+}