@nx/webpack 19.5.0 → 19.5.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/webpack",
-  "version": "19.5.0",
+  "version": "19.5.2",
   "private": false,
   "description": "The Nx Plugin for Webpack contains executors and generators that support building applications using Webpack.",
   "repository": {
@@ -33,6 +33,7 @@
     "@babel/core": "^7.23.2",
     "@phenomnomnominal/tsquery": "~5.0.1",
     "@module-federation/sdk": "^0.2.3",
+    "@module-federation/enhanced": "^0.2.3",
     "ajv": "^8.12.0",
     "autoprefixer": "^10.4.9",
     "babel-loader": "^9.1.2",
@@ -41,7 +42,9 @@
     "copy-webpack-plugin": "^10.2.4",
     "css-loader": "^6.4.0",
     "css-minimizer-webpack-plugin": "^5.0.0",
+    "express": "^4.19.2",
     "fork-ts-checker-webpack-plugin": "7.2.13",
+    "http-proxy-middleware": "^3.0.0",
     "less": "4.1.3",
     "less-loader": "11.1.0",
     "license-webpack-plugin": "^4.0.2",
@@ -66,9 +69,9 @@
     "webpack-dev-server": "^4.9.3",
     "webpack-node-externals": "^3.0.0",
     "webpack-subresource-integrity": "^5.1.0",
-    "@nx/devkit": "19.5.0",
-    "@nx/js": "19.5.0",
-    "@nrwl/webpack": "19.5.0"
+    "@nx/devkit": "19.5.2",
+    "@nx/js": "19.5.2",
+    "@nrwl/webpack": "19.5.2"
   },
   "publishConfig": {
     "access": "public"

package/src/utils/module-federation/get-remotes-for-host.d.ts

@@ -10,6 +10,7 @@ export declare function getRemotes(devRemotes: string[], skipRemotes: string[],
     devRemotes: any[];
     dynamicRemotes: any[];
     remotePorts: any[];
+    staticRemotePort: number;
 };
 export declare function getModuleFederationConfig(tsconfigPath: string, workspaceRoot: string, projectRoot: string, pluginName?: 'react' | 'angular'): any;
 export {};

package/src/utils/module-federation/get-remotes-for-host.js

@@ -57,14 +57,19 @@ function getRemotes(devRemotes, skipRemotes, config, context, pathToManifestFile
             ? (0, find_matching_projects_1.findMatchingProjects)(devRemotes, context.projectGraph.nodes)
             : (0, find_matching_projects_1.findMatchingProjects)([devRemotes], context.projectGraph.nodes));
     const staticRemotes = knownRemotes.filter((r) => !devServeApps.has(r));
-    const devServeRemotes = [...knownRemotes, ...dynamicRemotes].filter((r) => devServeApps.has(r));
+    const devServeRemotes = [...knownRemotes, ...knownDynamicRemotes].filter((r) => devServeApps.has(r));
     const staticDynamicRemotes = knownDynamicRemotes.filter((r) => !devServeApps.has(r));
     const remotePorts = [...devServeRemotes, ...staticDynamicRemotes].map((r) => context.projectGraph.nodes[r].data.targets['serve'].options.port);
+    const staticRemotePort = Math.max(...[
+        ...remotePorts,
+        ...staticRemotes.map((r) => context.projectGraph.nodes[r].data.targets['serve'].options.port),
+    ]) + 1;
     return {
         staticRemotes,
         devRemotes: devServeRemotes,
         dynamicRemotes: staticDynamicRemotes,
         remotePorts,
+        staticRemotePort,
     };
 }
 function getModuleFederationConfig(tsconfigPath, workspaceRoot, projectRoot, pluginName = 'react') {

package/src/utils/module-federation/models/index.d.ts

@@ -33,6 +33,12 @@ export interface ModuleFederationConfig {
     exposes?: Record<string, string>;
     shared?: SharedFunction;
     additionalShared?: AdditionalSharedConfig;
+    /**
+     * `nxRuntimeLibraryControlPlugin` is a runtime module federation plugin to ensure
+     * that shared libraries are resolved from a remote with live reload capabilities.
+     * If you run into any issues with loading shared libraries, try disabling this option.
+     */
+    disableNxRuntimeLibraryControlPlugin?: boolean;
 }
 export type NxModuleFederationConfigOverride = Omit<moduleFederationPlugin.ModuleFederationPluginOptions, 'exposes' | 'remotes' | 'name' | 'library' | 'shared' | 'filename' | 'remoteType'>;
 export type WorkspaceLibrarySecondaryEntryPoint = {

package/src/utils/module-federation/parse-static-remotes-config.d.ts

@@ -0,0 +1,12 @@
+import type { ExecutorContext } from '@nx/devkit';
+export type StaticRemoteConfig = {
+    basePath: string;
+    outputPath: string;
+    urlSegment: string;
+    port: number;
+};
+export type StaticRemotesConfig = {
+    remotes: string[];
+    config: Record<string, StaticRemoteConfig> | undefined;
+};
+export declare function parseStaticRemotesConfig(staticRemotes: string[] | undefined, context: ExecutorContext): StaticRemotesConfig;

package/src/utils/module-federation/parse-static-remotes-config.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseStaticRemotesConfig = parseStaticRemotesConfig;
+const path_1 = require("path");
+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);
+        const port = context.projectGraph.nodes[app].data.targets['serve'].options.port;
+        config[app] = { basePath, outputPath, urlSegment, port };
+    }
+    return { remotes: staticRemotes, config };
+}

package/src/utils/module-federation/plugins/runtime-library-control.plugin.d.ts

@@ -0,0 +1,3 @@
+import type { FederationRuntimePlugin } from '@module-federation/enhanced/runtime';
+declare const nxRuntimeLibraryControlPlugin: () => FederationRuntimePlugin;
+export default nxRuntimeLibraryControlPlugin;

package/src/utils/module-federation/plugins/runtime-library-control.plugin.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const runtimeStore = {
+    sharedPackagesFromDev: {},
+};
+if (process.env.NX_MF_DEV_REMOTES) {
+    // process.env.NX_MF_DEV_REMOTES is replaced by an array value via DefinePlugin, even though the original value is a stringified array.
+    runtimeStore.devRemotes = process.env
+        .NX_MF_DEV_REMOTES;
+}
+const nxRuntimeLibraryControlPlugin = function () {
+    return {
+        name: 'nx-runtime-library-control-plugin',
+        beforeInit(args) {
+            runtimeStore.name = args.options.name;
+            return args;
+        },
+        resolveShare: (args) => {
+            const { shareScopeMap, scope, pkgName, version, GlobalFederation } = args;
+            const originalResolver = args.resolver;
+            args.resolver = function () {
+                if (!runtimeStore.sharedPackagesFromDev[pkgName]) {
+                    if (!GlobalFederation.__INSTANCES__) {
+                        return originalResolver();
+                    }
+                    else if (!runtimeStore.devRemotes) {
+                        return originalResolver();
+                    }
+                    const devRemoteInstanceToUse = GlobalFederation.__INSTANCES__.find((instance) => instance.options.shared[pkgName] &&
+                        runtimeStore.devRemotes.find((dr) => instance.name === dr));
+                    if (!devRemoteInstanceToUse) {
+                        return originalResolver();
+                    }
+                    runtimeStore.sharedPackagesFromDev[pkgName] =
+                        devRemoteInstanceToUse.name;
+                }
+                const remoteInstanceName = runtimeStore.sharedPackagesFromDev[pkgName];
+                const remoteInstance = GlobalFederation.__INSTANCES__.find((instance) => instance.name === remoteInstanceName);
+                try {
+                    const remotePkgInfo = remoteInstance.options.shared[pkgName].find((shared) => shared.from === remoteInstanceName);
+                    remotePkgInfo.useIn.push(runtimeStore.name);
+                    remotePkgInfo.useIn = Array.from(new Set(remotePkgInfo.useIn));
+                    shareScopeMap[scope][pkgName][version] = remotePkgInfo;
+                    return remotePkgInfo;
+                }
+                catch {
+                    return originalResolver();
+                }
+            };
+            return args;
+        },
+    };
+};
+exports.default = nxRuntimeLibraryControlPlugin;

package/src/utils/module-federation/start-remote-proxies.d.ts

@@ -0,0 +1,2 @@
+import { StaticRemotesConfig } from './parse-static-remotes-config';
+export declare function startRemoteProxies(staticRemotesConfig: StaticRemotesConfig, mappedLocationsOfRemotes: Record<string, string>): void;

package/src/utils/module-federation/start-remote-proxies.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.startRemoteProxies = startRemoteProxies;
+const devkit_1 = require("@nx/devkit");
+function startRemoteProxies(staticRemotesConfig, mappedLocationsOfRemotes) {
+    const { createProxyMiddleware } = require('http-proxy-middleware');
+    const express = require('express');
+    devkit_1.logger.info(`NX Starting static remotes proxies...`);
+    for (const app of staticRemotesConfig.remotes) {
+        const expressProxy = express();
+        expressProxy.use(createProxyMiddleware({
+            target: mappedLocationsOfRemotes[app],
+            changeOrigin: true,
+        }));
+        const proxyServer = expressProxy.listen(staticRemotesConfig.config[app].port);
+        process.on('SIGTERM', () => proxyServer.close());
+        process.on('exit', () => proxyServer.close());
+    }
+    devkit_1.logger.info(`NX Static remotes proxies started successfully`);
+}