webpack 5.93.0 → 5.94.0

package/lib/ExternalModule.js

@@ -53,7 +53,7 @@ const { register } = require("./util/serialization");
 /** @typedef {import("./util/fs").InputFileSystem} InputFileSystem */
 /** @typedef {import("./util/runtime").RuntimeSpec} RuntimeSpec */
 
-/** @typedef {{ attributes?: ImportAttributes }} ImportDependencyMeta */
+/** @typedef {{ attributes?: ImportAttributes, externalType: "import" | "module" | undefined }} ImportDependencyMeta */
 /** @typedef {{ layer?: string, supports?: string, media?: string }} CssImportDependencyMeta */
 
 /** @typedef {ImportDependencyMeta | CssImportDependencyMeta} DependencyMeta */
@@ -164,7 +164,10 @@ const getSourceForImportExternal = (
 	dependencyMeta
 ) => {
 	const importName = runtimeTemplate.outputOptions.importFunctionName;
-	if (!runtimeTemplate.supportsDynamicImport() && importName === "import") {
+	if (
+		!runtimeTemplate.supportsDynamicImport() &&
+		(importName === "import" || importName === "module-import")
+	) {
 		throw new Error(
 			"The target environment doesn't support 'import()' so it's not possible to use external type 'import'"
 		);
@@ -210,7 +213,7 @@ const getSourceForImportExternal = (
  */
 const importAssertionReplacer = (key, value) => {
 	if (key === "_isLegacyAssert") {
-		return undefined;
+		return;
 	}
 
 	return value;
@@ -353,7 +356,7 @@ const getSourceForModuleExternal = (
 		runtime,
 		runtimeTemplate
 	);
-	let expression = moduleRemapping || baseAccess;
+	const expression = moduleRemapping || baseAccess;
 	return {
 		expression,
 		init: moduleRemapping
@@ -415,11 +418,10 @@ const getSourceForScriptExternal = (urlAndGlobal, runtimeTemplate) => {
  * @param {RuntimeTemplate} runtimeTemplate the runtime template
  * @returns {string} the generated source
  */
-const checkExternalVariable = (variableName, request, runtimeTemplate) => {
-	return `if(typeof ${variableName} === 'undefined') { ${runtimeTemplate.throwMissingModuleErrorBlock(
+const checkExternalVariable = (variableName, request, runtimeTemplate) =>
+	`if(typeof ${variableName} === 'undefined') { ${runtimeTemplate.throwMissingModuleErrorBlock(
 		{ request }
 	)} }\n`;
-};
 
 /**
  * @param {string|number} id the module id
@@ -532,7 +534,7 @@ class ExternalModule extends Module {
 	 * @returns {string} a user readable identifier of the module
 	 */
 	readableIdentifier(requestShortener) {
-		return "external " + JSON.stringify(this.request);
+		return `external ${JSON.stringify(this.request)}`;
 	}
 
 	/**
@@ -544,6 +546,25 @@ class ExternalModule extends Module {
 		return callback(null, !this.buildMeta);
 	}
 
+	/**
+	 * @param {string} externalType raw external type
+	 * @returns {string} resolved external type
+	 */
+	getModuleImportType(externalType) {
+		if (externalType === "module-import") {
+			if (
+				this.dependencyMeta &&
+				/** @type {ImportDependencyMeta} */ (this.dependencyMeta).externalType
+			) {
+				return /** @type {ImportDependencyMeta} */ (this.dependencyMeta)
+					.externalType;
+			}
+			return "module";
+		}
+
+		return externalType;
+	}
+
 	/**
 	 * @param {WebpackOptions} options webpack options
 	 * @param {Compilation} compilation the compilation
@@ -576,25 +597,6 @@ class ExternalModule extends Module {
 					canMangle = true;
 				}
 				break;
-			case "module":
-				if (this.buildInfo.module) {
-					if (!Array.isArray(request) || request.length === 1) {
-						this.buildMeta.exportsType = "namespace";
-						canMangle = true;
-					}
-				} else {
-					this.buildMeta.async = true;
-					EnvironmentNotSupportAsyncWarning.check(
-						this,
-						compilation.runtimeTemplate,
-						"external module"
-					);
-					if (!Array.isArray(request) || request.length === 1) {
-						this.buildMeta.exportsType = "namespace";
-						canMangle = false;
-					}
-				}
-				break;
 			case "script":
 				this.buildMeta.async = true;
 				EnvironmentNotSupportAsyncWarning.check(
@@ -611,18 +613,45 @@ class ExternalModule extends Module {
 					"external promise"
 				);
 				break;
+			case "module":
 			case "import":
-				this.buildMeta.async = true;
-				EnvironmentNotSupportAsyncWarning.check(
-					this,
-					compilation.runtimeTemplate,
-					"external import"
-				);
-				if (!Array.isArray(request) || request.length === 1) {
-					this.buildMeta.exportsType = "namespace";
-					canMangle = false;
+			case "module-import": {
+				const type = this.getModuleImportType(externalType);
+				if (type === "module") {
+					if (this.buildInfo.module) {
+						if (!Array.isArray(request) || request.length === 1) {
+							this.buildMeta.exportsType = "namespace";
+							canMangle = true;
+						}
+					} else {
+						this.buildMeta.async = true;
+						EnvironmentNotSupportAsyncWarning.check(
+							this,
+							compilation.runtimeTemplate,
+							"external module"
+						);
+						if (!Array.isArray(request) || request.length === 1) {
+							this.buildMeta.exportsType = "namespace";
+							canMangle = false;
+						}
+					}
 				}
+
+				if (type === "import") {
+					this.buildMeta.async = true;
+					EnvironmentNotSupportAsyncWarning.check(
+						this,
+						compilation.runtimeTemplate,
+						"external import"
+					);
+					if (!Array.isArray(request) || request.length === 1) {
+						this.buildMeta.exportsType = "namespace";
+						canMangle = false;
+					}
+				}
+
 				break;
+			}
 		}
 		this.addDependency(new StaticExportsDependency(true, canMangle));
 		callback();
@@ -702,7 +731,8 @@ class ExternalModule extends Module {
 							request,
 							/** @type {string} */
 							(runtimeTemplate.outputOptions.importMetaName),
-							runtimeTemplate.supportNodePrefixForCoreModules()
+							/** @type {boolean} */
+							(runtimeTemplate.supportNodePrefixForCoreModules())
 						)
 					: getSourceForCommonJsExternal(request);
 			case "amd":
@@ -719,42 +749,52 @@ class ExternalModule extends Module {
 					runtimeTemplate
 				);
 			}
-			case "import":
-				return getSourceForImportExternal(
-					request,
-					runtimeTemplate,
-					/** @type {ImportDependencyMeta} */ (dependencyMeta)
-				);
 			case "script":
 				return getSourceForScriptExternal(request, runtimeTemplate);
-			case "module": {
-				if (!(/** @type {BuildInfo} */ (this.buildInfo).module)) {
-					if (!runtimeTemplate.supportsDynamicImport()) {
-						throw new Error(
-							"The target environment doesn't support dynamic import() syntax so it's not possible to use external type 'module' within a script" +
-								(runtimeTemplate.supportsEcmaScriptModuleSyntax()
-									? "\nDid you mean to build a EcmaScript Module ('output.module: true')?"
-									: "")
-						);
-					}
+			case "module":
+			case "import":
+			case "module-import": {
+				const type = this.getModuleImportType(externalType);
+				if (type === "import") {
 					return getSourceForImportExternal(
 						request,
 						runtimeTemplate,
 						/** @type {ImportDependencyMeta} */ (dependencyMeta)
 					);
 				}
-				if (!runtimeTemplate.supportsEcmaScriptModuleSyntax()) {
-					throw new Error(
-						"The target environment doesn't support EcmaScriptModule syntax so it's not possible to use external type 'module'"
+
+				if (type === "module") {
+					if (!(/** @type {BuildInfo} */ (this.buildInfo).module)) {
+						if (!runtimeTemplate.supportsDynamicImport()) {
+							throw new Error(
+								`The target environment doesn't support dynamic import() syntax so it's not possible to use external type 'module' within a script${
+									runtimeTemplate.supportsEcmaScriptModuleSyntax()
+										? "\nDid you mean to build a EcmaScript Module ('output.module: true')?"
+										: ""
+								}`
+							);
+						}
+						return getSourceForImportExternal(
+							request,
+							runtimeTemplate,
+							/** @type {ImportDependencyMeta} */ (dependencyMeta)
+						);
+					}
+					if (!runtimeTemplate.supportsEcmaScriptModuleSyntax()) {
+						throw new Error(
+							"The target environment doesn't support EcmaScriptModule syntax so it's not possible to use external type 'module'"
+						);
+					}
+					return getSourceForModuleExternal(
+						request,
+						moduleGraph.getExportsInfo(this),
+						runtime,
+						runtimeTemplate,
+						/** @type {ImportDependencyMeta} */ (dependencyMeta)
 					);
 				}
-				return getSourceForModuleExternal(
-					request,
-					moduleGraph.getExportsInfo(this),
-					runtime,
-					runtimeTemplate,
-					/** @type {ImportDependencyMeta} */ (dependencyMeta)
-				);
+
+				break;
 			}
 			case "var":
 			case "promise":
@@ -846,7 +886,7 @@ class ExternalModule extends Module {
 				if (sourceData.init)
 					sourceString = `${sourceData.init}\n${sourceString}`;
 
-				let data = undefined;
+				let data;
 				if (sourceData.chunkInitFragments) {
 					data = new Map();
 					data.set("chunkInitFragments", sourceData.chunkInitFragments);

package/lib/ExternalModuleFactoryPlugin.js

@@ -25,6 +25,7 @@ const EMPTY_RESOLVE_OPTIONS = {};
 // TODO webpack 6 remove this
 const callDeprecatedExternals = util.deprecate(
 	(externalsFunction, context, request, cb) => {
+		// eslint-disable-next-line no-useless-call
 		externalsFunction.call(null, context, request, cb);
 	},
 	"The externals-function should be defined like ({context, request}, cb) => { ... }",
@@ -33,6 +34,11 @@ const callDeprecatedExternals = util.deprecate(
 
 const cache = new WeakMap();
 
+/**
+ * @param {object} obj obj
+ * @param {TODO} layer layer
+ * @returns {object} result
+ */
 const resolveLayer = (obj, layer) => {
 	let map = cache.get(obj);
 	if (map === undefined) {
@@ -47,6 +53,9 @@ const resolveLayer = (obj, layer) => {
 	return result;
 };
 
+/** @typedef {string|string[]|boolean|Record<string, string|string[]>} ExternalValue */
+/** @typedef {string|undefined} ExternalType */
+
 class ExternalModuleFactoryPlugin {
 	/**
 	 * @param {string | undefined} type default external type
@@ -72,8 +81,8 @@ class ExternalModuleFactoryPlugin {
 				const dependencyType = data.dependencyType;
 
 				/**
-				 * @param {string|string[]|boolean|Record<string, string|string[]>} value the external config
-				 * @param {string|undefined} type type of external
+				 * @param {ExternalValue} value the external config
+				 * @param {ExternalType | undefined} type type of external
 				 * @param {function((Error | null)=, ExternalModule=): void} callback callback
 				 * @returns {void}
 				 */
@@ -83,12 +92,7 @@ class ExternalModuleFactoryPlugin {
 						return callback();
 					}
 					/** @type {string | string[] | Record<string, string|string[]>} */
-					let externalConfig;
-					if (value === true) {
-						externalConfig = dependency.request;
-					} else {
-						externalConfig = value;
-					}
+					let externalConfig = value === true ? dependency.request : value;
 					// When no explicit type is specified, extract it from the externalConfig
 					if (type === undefined) {
 						if (
@@ -122,8 +126,16 @@ class ExternalModuleFactoryPlugin {
 						dependency instanceof ImportDependency ||
 						dependency instanceof ContextElementDependency
 					) {
+						const externalType =
+							dependency instanceof HarmonyImportDependency
+								? "module"
+								: dependency instanceof ImportDependency
+									? "import"
+									: undefined;
+
 						dependencyMeta = {
-							attributes: dependency.assertions
+							attributes: dependency.assertions,
+							externalType
 						};
 					} else if (dependency instanceof CssImportDependency) {
 						dependencyMeta = {
@@ -137,7 +149,8 @@ class ExternalModuleFactoryPlugin {
 						null,
 						new ExternalModule(
 							externalConfig,
-							type || globalType,
+							/** @type {string} */
+							(type || globalType),
 							dependency.request,
 							dependencyMeta
 						)