fix: ESM default export handling for .mjs files in Module Federation (#20189)

y-okt · web-flow · commit 50e099730eef · 2025-12-20T16:07:28.000+03:00
diff --git a/.changeset/brown-apricots-work.md b/.changeset/brown-apricots-work.md
@@ -0,0 +1,5 @@
+---
+"webpack": patch
+---
+
+Fixed ESM default export handling for `.mjs` files in Module Federation
diff --git a/lib/container/RemoteModule.js b/lib/container/RemoteModule.js
@@ -25,6 +25,8 @@ const RemoteToExternalDependency = require("./RemoteToExternalDependency");
 /** @typedef {import("../Module").NeedBuildCallback} NeedBuildCallback */
 /** @typedef {import("../Module").NeedBuildContext} NeedBuildContext */
 /** @typedef {import("../Module").SourceTypes} SourceTypes */
+/** @typedef {import("../ModuleGraph")} ModuleGraph */
+/** @typedef {import("../Module").ExportsType} ExportsType */
 /** @typedef {import("../RequestShortener")} RequestShortener */
 /** @typedef {import("../ResolverFactory").ResolverWithOptions} ResolverWithOptions */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
@@ -128,6 +130,19 @@ class RemoteModule extends Module {
 		return REMOTE_AND_SHARE_INIT_TYPES;
 	}
 
+	/**
+	 * @param {ModuleGraph} moduleGraph the module graph
+	 * @param {boolean | undefined} strict the importing module is strict
+	 * @returns {ExportsType} export type
+	 * "namespace": Exports is already a namespace object. namespace = exports.
+	 * "dynamic": Check at runtime if __esModule is set. When set: namespace = { ...exports, default: exports }. When not set: namespace = { default: exports }.
+	 * "default-only": Provide a namespace object with only default export. namespace = { default: exports }
+	 * "default-with-named": Provide a namespace object with named and default export. namespace = { ...exports, default: exports }
+	 */
+	getExportsType(moduleGraph, strict) {
+		return "dynamic";
+	}
+
 	/**
 	 * @returns {NameForCondition | null} absolute path which should be used for condition matching (usually the resource path)
 	 */
diff --git a/lib/sharing/ConsumeSharedModule.js b/lib/sharing/ConsumeSharedModule.js
@@ -28,6 +28,8 @@ const ConsumeSharedFallbackDependency = require("./ConsumeSharedFallbackDependen
 /** @typedef {import("../Module").NeedBuildCallback} NeedBuildCallback */
 /** @typedef {import("../Module").NeedBuildContext} NeedBuildContext */
 /** @typedef {import("../Module").SourceTypes} SourceTypes */
+/** @typedef {import("../ModuleGraph")} ModuleGraph */
+/** @typedef {import("../Module").ExportsType} ExportsType */
 /** @typedef {import("../RequestShortener")} RequestShortener */
 /** @typedef {import("../ResolverFactory").ResolverWithOptions} ResolverWithOptions */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
@@ -153,6 +155,43 @@ class ConsumeSharedModule extends Module {
 		return CONSUME_SHARED_TYPES;
 	}
 
+	/**
+	 * @param {ModuleGraph} moduleGraph the module graph
+	 * @param {boolean | undefined} strict the importing module is strict
+	 * @returns {ExportsType} export type
+	 * "namespace": Exports is already a namespace object. namespace = exports.
+	 * "dynamic": Check at runtime if __esModule is set. When set: namespace = { ...exports, default: exports }. When not set: namespace = { default: exports }.
+	 * "default-only": Provide a namespace object with only default export. namespace = { default: exports }
+	 * "default-with-named": Provide a namespace object with named and default export. namespace = { ...exports, default: exports }
+	 */
+	getExportsType(moduleGraph, strict) {
+		if (this.options.import) {
+			let fallbackModule = null;
+
+			if (this.options.eager) {
+				const dep = this.dependencies[0];
+				if (dep) {
+					fallbackModule = moduleGraph.getModule(dep);
+				}
+			} else {
+				const block = this.blocks[0];
+				if (block && block.dependencies.length > 0) {
+					fallbackModule = moduleGraph.getModule(block.dependencies[0]);
+				}
+			}
+
+			if (
+				fallbackModule &&
+				fallbackModule.buildMeta &&
+				fallbackModule.buildMeta.exportsType === "namespace"
+			) {
+				return "namespace";
+			}
+		}
+
+		return "dynamic";
+	}
+
 	/**
 	 * @param {string=} type the source type for which the size should be estimated
 	 * @returns {number} the estimated size of the module (must be non-zero)
diff --git a/test/configCases/sharing/consume-module-mjs-default-export/index.js b/test/configCases/sharing/consume-module-mjs-default-export/index.js
@@ -0,0 +1,10 @@
+it("should correctly handle default imports in .mjs files from shared modules", async () => {
+	await __webpack_init_sharing__("default");
+
+	const { testDefaultImport } = await import("./pure-esm-consumer.mjs");
+	const result = testDefaultImport();
+
+	expect(result.defaultType).toBe("function");
+	expect(result.defaultValue).toBe("shared default export");
+	expect(result.namedExportValue).toBe("shared named export");
+});
diff --git a/test/configCases/sharing/consume-module-mjs-default-export/node_modules/shared-esm-pkg/index.js b/test/configCases/sharing/consume-module-mjs-default-export/node_modules/shared-esm-pkg/index.js
diff --git a/test/configCases/sharing/consume-module-mjs-default-export/node_modules/shared-esm-pkg/package.json b/test/configCases/sharing/consume-module-mjs-default-export/node_modules/shared-esm-pkg/package.json
diff --git a/test/configCases/sharing/consume-module-mjs-default-export/pure-esm-consumer.mjs b/test/configCases/sharing/consume-module-mjs-default-export/pure-esm-consumer.mjs
@@ -0,0 +1,10 @@
+import something from "shared-esm-pkg";
+import { namedExport } from "shared-esm-pkg";
+
+export function testDefaultImport() {
+	return {
+		defaultType: typeof something,
+		defaultValue: typeof something === "function" ? something() : something,
+		namedExportValue: namedExport
+	};
+}
diff --git a/test/configCases/sharing/consume-module-mjs-default-export/webpack.config.js b/test/configCases/sharing/consume-module-mjs-default-export/webpack.config.js
@@ -0,0 +1,25 @@
+"use strict";
+
+const { ConsumeSharedPlugin, ProvideSharedPlugin } =
+	require("../../../../").sharing;
+
+/** @type {import("../../../../").Configuration} */
+module.exports = {
+	mode: "development",
+	plugins: [
+		new ProvideSharedPlugin({
+			provides: {
+				"shared-esm-pkg": {
+					version: "1.0.0"
+				}
+			}
+		}),
+		new ConsumeSharedPlugin({
+			consumes: {
+				"shared-esm-pkg": {
+					requiredVersion: "^1.0.0"
+				}
+			}
+		})
+	]
+};

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"webpack": patch
 +---
++
 +Fixed ESM default export handling for `.mjs` files in Module Federation