webpack 5.59.0 → 5.94.0

package/lib/dependencies/CommonJsExportsParserPlugin.js

@@ -16,11 +16,36 @@ const DynamicExports = require("./DynamicExports");
 const HarmonyExports = require("./HarmonyExports");
 const ModuleDecoratorDependency = require("./ModuleDecoratorDependency");
 
-/** @typedef {import("estree").Expression} ExpressionNode */
+/** @typedef {import("estree").AssignmentExpression} AssignmentExpression */
+/** @typedef {import("estree").CallExpression} CallExpression */
+/** @typedef {import("estree").Expression} Expression */
+/** @typedef {import("estree").Super} Super */
+/** @typedef {import("../Dependency").DependencyLocation} DependencyLocation */
+/** @typedef {import("../ModuleGraph")} ModuleGraph */
 /** @typedef {import("../NormalModule")} NormalModule */
 /** @typedef {import("../javascript/BasicEvaluatedExpression")} BasicEvaluatedExpression */
 /** @typedef {import("../javascript/JavascriptParser")} JavascriptParser */
+/** @typedef {import("../javascript/JavascriptParser").Range} Range */
+/** @typedef {import("./CommonJsDependencyHelpers").CommonJSDependencyBaseKeywords} CommonJSDependencyBaseKeywords */
 
+/**
+ * This function takes a generic expression and detects whether it is an ObjectExpression.
+ * This is used in the context of parsing CommonJS exports to get the value of the property descriptor
+ * when the `exports` object is assigned to `Object.defineProperty`.
+ *
+ * In CommonJS modules, the `exports` object can be assigned to `Object.defineProperty` and therefore
+ * webpack has to detect this case and get the value key of the property descriptor. See the following example
+ * for more information: https://astexplorer.net/#/gist/83ce51a4e96e59d777df315a6d111da6/8058ead48a1bb53c097738225db0967ef7f70e57
+ *
+ * This would be an example of a CommonJS module that exports an object with a property descriptor:
+ * ```js
+ * Object.defineProperty(exports, "__esModule", { value: true });
+ * exports.foo = void 0;
+ * exports.foo = "bar";
+ * ```
+ * @param {TODO} expr expression
+ * @returns {Expression | undefined} returns the value of property descriptor
+ */
 const getValueOfPropertyDescription = expr => {
 	if (expr.type !== "ObjectExpression") return;
 	for (const property of expr.properties) {
@@ -31,16 +56,30 @@ const getValueOfPropertyDescription = expr => {
 	}
 };
 
+/**
+ * The purpose of this function is to check whether an expression is a truthy literal or not. This is
+ * useful when parsing CommonJS exports, because CommonJS modules can export any value, including falsy
+ * values like `null` and `false`. However, exports should only be created if the exported value is truthy.
+ * @param {Expression} expr expression being checked
+ * @returns {boolean} true, when the expression is a truthy literal
+ */
 const isTruthyLiteral = expr => {
 	switch (expr.type) {
 		case "Literal":
-			return !!expr.value;
+			return Boolean(expr.value);
 		case "UnaryExpression":
 			if (expr.operator === "!") return isFalsyLiteral(expr.argument);
 	}
 	return false;
 };
 
+/**
+ * The purpose of this function is to check whether an expression is a falsy literal or not. This is
+ * useful when parsing CommonJS exports, because CommonJS modules can export any value, including falsy
+ * values like `null` and `false`. However, exports should only be created if the exported value is truthy.
+ * @param {Expression} expr expression being checked
+ * @returns {boolean} true, when the expression is a falsy literal
+ */
 const isFalsyLiteral = expr => {
 	switch (expr.type) {
 		case "Literal":
@@ -53,7 +92,7 @@ const isFalsyLiteral = expr => {
 
 /**
  * @param {JavascriptParser} parser the parser
- * @param {ExpressionNode} expr expression
+ * @param {Expression} expr expression
  * @returns {{ argument: BasicEvaluatedExpression, ids: string[] } | undefined} parsed call
  */
 const parseRequireCall = (parser, expr) => {
@@ -86,17 +125,28 @@ const parseRequireCall = (parser, expr) => {
 };
 
 class CommonJsExportsParserPlugin {
+	/**
+	 * @param {ModuleGraph} moduleGraph module graph
+	 */
 	constructor(moduleGraph) {
 		this.moduleGraph = moduleGraph;
 	}
 
 	/**
 	 * @param {JavascriptParser} parser the parser
+	 * @returns {void}
 	 */
 	apply(parser) {
 		const enableStructuredExports = () => {
 			DynamicExports.enable(parser.state);
 		};
+
+		/**
+		 * @param {boolean} topLevel true, when the export is on top level
+		 * @param {string[]} members members of the export
+		 * @param {Expression | undefined} valueExpr expression for the value
+		 * @returns {void}
+		 */
 		const checkNamespace = (topLevel, members, valueExpr) => {
 			if (!DynamicExports.isEnabled(parser.state)) return;
 			if (members.length > 0 && members[0] === "__esModule") {
@@ -107,10 +157,16 @@ class CommonJsExportsParserPlugin {
 				}
 			}
 		};
+		/**
+		 * @param {string=} reason reason
+		 */
 		const bailout = reason => {
 			DynamicExports.bailout(parser.state);
 			if (reason) bailoutHint(reason);
 		};
+		/**
+		 * @param {string} reason reason
+		 */
 		const bailoutHint = reason => {
 			this.moduleGraph
 				.getOptimizationBailout(parser.state.module)
@@ -126,6 +182,13 @@ class CommonJsExportsParserPlugin {
 			.tap("CommonJsPlugin", evaluateToString("object"));
 
 		// exporting //
+
+		/**
+		 * @param {AssignmentExpression} expr expression
+		 * @param {CommonJSDependencyBaseKeywords} base commonjs base keywords
+		 * @param {string[]} members members of the export
+		 * @returns {boolean | undefined} true, when the expression was handled
+		 */
 		const handleAssignExport = (expr, base, members) => {
 			if (HarmonyExports.isEnabled(parser.state)) return;
 			// Handle reexporting
@@ -139,16 +202,16 @@ class CommonJsExportsParserPlugin {
 				// It's possible to reexport __esModule, so we must convert to a dynamic module
 				if (members.length === 0) DynamicExports.setDynamic(parser.state);
 				const dep = new CommonJsExportRequireDependency(
-					expr.range,
+					/** @type {Range} */ (expr.range),
 					null,
 					base,
 					members,
-					requireCall.argument.string,
+					/** @type {string} */ (requireCall.argument.string),
 					requireCall.ids,
 					!parser.isStatementLevelExpression(expr)
 				);
-				dep.loc = expr.loc;
-				dep.optional = !!parser.scope.inTry;
+				dep.loc = /** @type {DependencyLocation} */ (expr.loc);
+				dep.optional = Boolean(parser.scope.inTry);
 				parser.state.module.addDependency(dep);
 				return true;
 			}
@@ -162,21 +225,21 @@ class CommonJsExportsParserPlugin {
 				expr.right
 			);
 			const dep = new CommonJsExportsDependency(
-				expr.left.range,
+				/** @type {Range} */ (expr.left.range),
 				null,
 				base,
 				remainingMembers
 			);
-			dep.loc = expr.loc;
+			dep.loc = /** @type {DependencyLocation} */ (expr.loc);
 			parser.state.module.addDependency(dep);
 			parser.walkExpression(expr.right);
 			return true;
 		};
 		parser.hooks.assignMemberChain
 			.for("exports")
-			.tap("CommonJsExportsParserPlugin", (expr, members) => {
-				return handleAssignExport(expr, "exports", members);
-			});
+			.tap("CommonJsExportsParserPlugin", (expr, members) =>
+				handleAssignExport(expr, "exports", members)
+			);
 		parser.hooks.assignMemberChain
 			.for("this")
 			.tap("CommonJsExportsParserPlugin", (expr, members) => {
@@ -192,16 +255,14 @@ class CommonJsExportsParserPlugin {
 		parser.hooks.call
 			.for("Object.defineProperty")
 			.tap("CommonJsExportsParserPlugin", expression => {
-				const expr = /** @type {import("estree").CallExpression} */ (
-					expression
-				);
+				const expr = /** @type {CallExpression} */ (expression);
 				if (!parser.isStatementLevelExpression(expr)) return;
 				if (expr.arguments.length !== 3) return;
 				if (expr.arguments[0].type === "SpreadElement") return;
 				if (expr.arguments[1].type === "SpreadElement") return;
 				if (expr.arguments[2].type === "SpreadElement") return;
 				const exportsArg = parser.evaluateExpression(expr.arguments[0]);
-				if (!exportsArg || !exportsArg.isIdentifier()) return;
+				if (!exportsArg.isIdentifier()) return;
 				if (
 					exportsArg.identifier !== "exports" &&
 					exportsArg.identifier !== "module.exports" &&
@@ -210,7 +271,6 @@ class CommonJsExportsParserPlugin {
 					return;
 				}
 				const propertyArg = parser.evaluateExpression(expr.arguments[1]);
-				if (!propertyArg) return;
 				const property = propertyArg.asString();
 				if (typeof property !== "string") return;
 				enableStructuredExports();
@@ -221,12 +281,12 @@ class CommonJsExportsParserPlugin {
 					getValueOfPropertyDescription(descArg)
 				);
 				const dep = new CommonJsExportsDependency(
-					expr.range,
-					expr.arguments[2].range,
+					/** @type {Range} */ (expr.range),
+					/** @type {Range} */ (expr.arguments[2].range),
 					`Object.defineProperty(${exportsArg.identifier})`,
 					[property]
 				);
-				dep.loc = expr.loc;
+				dep.loc = /** @type {DependencyLocation} */ (expr.loc);
 				parser.state.module.addDependency(dep);
 
 				parser.walkExpression(expr.arguments[2]);
@@ -234,27 +294,39 @@ class CommonJsExportsParserPlugin {
 			});
 
 		// Self reference //
-		const handleAccessExport = (expr, base, members, call = undefined) => {
+
+		/**
+		 * @param {Expression | Super} expr expression
+		 * @param {CommonJSDependencyBaseKeywords} base commonjs base keywords
+		 * @param {string[]} members members of the export
+		 * @param {CallExpression=} call call expression
+		 * @returns {boolean | void} true, when the expression was handled
+		 */
+		const handleAccessExport = (expr, base, members, call) => {
 			if (HarmonyExports.isEnabled(parser.state)) return;
 			if (members.length === 0) {
-				bailout(`${base} is used directly at ${formatLocation(expr.loc)}`);
+				bailout(
+					`${base} is used directly at ${formatLocation(
+						/** @type {DependencyLocation} */ (expr.loc)
+					)}`
+				);
 			}
 			if (call && members.length === 1) {
 				bailoutHint(
 					`${base}${propertyAccess(
 						members
 					)}(...) prevents optimization as ${base} is passed as call context at ${formatLocation(
-						expr.loc
+						/** @type {DependencyLocation} */ (expr.loc)
 					)}`
 				);
 			}
 			const dep = new CommonJsSelfReferenceDependency(
-				expr.range,
+				/** @type {Range} */ (expr.range),
 				base,
 				members,
-				!!call
+				Boolean(call)
 			);
-			dep.loc = expr.loc;
+			dep.loc = /** @type {DependencyLocation} */ (expr.loc);
 			parser.state.module.addDependency(dep);
 			if (call) {
 				parser.walkExpressions(call.arguments);
@@ -263,19 +335,19 @@ class CommonJsExportsParserPlugin {
 		};
 		parser.hooks.callMemberChain
 			.for("exports")
-			.tap("CommonJsExportsParserPlugin", (expr, members) => {
-				return handleAccessExport(expr.callee, "exports", members, expr);
-			});
+			.tap("CommonJsExportsParserPlugin", (expr, members) =>
+				handleAccessExport(expr.callee, "exports", members, expr)
+			);
 		parser.hooks.expressionMemberChain
 			.for("exports")
-			.tap("CommonJsExportsParserPlugin", (expr, members) => {
-				return handleAccessExport(expr, "exports", members);
-			});
+			.tap("CommonJsExportsParserPlugin", (expr, members) =>
+				handleAccessExport(expr, "exports", members)
+			);
 		parser.hooks.expression
 			.for("exports")
-			.tap("CommonJsExportsParserPlugin", expr => {
-				return handleAccessExport(expr, "exports", []);
-			});
+			.tap("CommonJsExportsParserPlugin", expr =>
+				handleAccessExport(expr, "exports", [])
+			);
 		parser.hooks.callMemberChain
 			.for("module")
 			.tap("CommonJsExportsParserPlugin", (expr, members) => {
@@ -295,9 +367,9 @@ class CommonJsExportsParserPlugin {
 			});
 		parser.hooks.expression
 			.for("module.exports")
-			.tap("CommonJsExportsParserPlugin", expr => {
-				return handleAccessExport(expr, "module.exports", []);
-			});
+			.tap("CommonJsExportsParserPlugin", expr =>
+				handleAccessExport(expr, "module.exports", [])
+			);
 		parser.hooks.callMemberChain
 			.for("this")
 			.tap("CommonJsExportsParserPlugin", (expr, members) => {
@@ -327,7 +399,7 @@ class CommonJsExportsParserPlugin {
 					: RuntimeGlobals.nodeModuleDecorator,
 				!isHarmony
 			);
-			dep.loc = expr.loc;
+			dep.loc = /** @type {DependencyLocation} */ (expr.loc);
 			parser.state.module.addDependency(dep);
 			return true;
 		});

package/lib/dependencies/CommonJsFullRequireDependency.js

@@ -7,6 +7,7 @@
 
 const Template = require("../Template");
 const { equals } = require("../util/ArrayHelpers");
+const { getTrimmedIdsAndRange } = require("../util/chainedImports");
 const makeSerializable = require("../util/makeSerializable");
 const propertyAccess = require("../util/propertyAccess");
 const ModuleDependency = require("./ModuleDependency");
@@ -16,18 +17,28 @@ const ModuleDependency = require("./ModuleDependency");
 /** @typedef {import("../Dependency").ReferencedExport} ReferencedExport */
 /** @typedef {import("../DependencyTemplate").DependencyTemplateContext} DependencyTemplateContext */
 /** @typedef {import("../ModuleGraph")} ModuleGraph */
+/** @typedef {import("../javascript/JavascriptParser").Range} Range */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
 /** @typedef {import("../util/runtime").RuntimeSpec} RuntimeSpec */
 
 class CommonJsFullRequireDependency extends ModuleDependency {
 	/**
 	 * @param {string} request the request string
-	 * @param {[number, number]} range location in source code
+	 * @param {Range} range location in source code
 	 * @param {string[]} names accessed properties on module
+	 * @param {Range[]=} idRanges ranges for members of ids; the two arrays are right-aligned
 	 */
-	constructor(request, range, names) {
+	constructor(
+		request,
+		range,
+		names,
+		idRanges /* TODO webpack 6 make this non-optional. It must always be set to properly trim ids. */
+	) {
 		super(request);
 		this.range = range;
 		this.names = names;
+		this.idRanges = idRanges;
 		this.call = false;
 		this.asiSafe = undefined;
 	}
@@ -51,17 +62,25 @@ class CommonJsFullRequireDependency extends ModuleDependency {
 		return [this.names];
 	}
 
+	/**
+	 * @param {ObjectSerializerContext} context context
+	 */
 	serialize(context) {
 		const { write } = context;
 		write(this.names);
+		write(this.idRanges);
 		write(this.call);
 		write(this.asiSafe);
 		super.serialize(context);
 	}
 
+	/**
+	 * @param {ObjectDeserializerContext} context context
+	 */
 	deserialize(context) {
 		const { read } = context;
 		this.names = read();
+		this.idRanges = read();
 		this.call = read();
 		this.asiSafe = read();
 		super.deserialize(context);
@@ -108,19 +127,34 @@ CommonJsFullRequireDependency.Template = class CommonJsFullRequireDependencyTemp
 			weak: dep.weak,
 			runtimeRequirements
 		});
+
+		const {
+			trimmedRange: [trimmedRangeStart, trimmedRangeEnd],
+			trimmedIds
+		} = getTrimmedIdsAndRange(
+			dep.names,
+			dep.range,
+			dep.idRanges,
+			moduleGraph,
+			dep
+		);
+
 		if (importedModule) {
-			const ids = dep.names;
 			const usedImported = moduleGraph
 				.getExportsInfo(importedModule)
-				.getUsedName(ids, runtime);
+				.getUsedName(trimmedIds, runtime);
 			if (usedImported) {
-				const comment = equals(usedImported, ids)
+				const comment = equals(usedImported, trimmedIds)
 					? ""
-					: Template.toNormalComment(propertyAccess(ids)) + " ";
-				requireExpr += `${comment}${propertyAccess(usedImported)}`;
+					: `${Template.toNormalComment(propertyAccess(trimmedIds))} `;
+				const access = `${comment}${propertyAccess(usedImported)}`;
+				requireExpr =
+					dep.asiSafe === true
+						? `(${requireExpr}${access})`
+						: `${requireExpr}${access}`;
 			}
 		}
-		source.replace(dep.range[0], dep.range[1] - 1, requireExpr);
+		source.replace(trimmedRangeStart, trimmedRangeEnd - 1, requireExpr);
 	}
 };