webpack 5.102.0 → 5.103.0

package/lib/css/walkCssTokens.js

@@ -66,7 +66,7 @@ const CC_LOWER_Z = "z".charCodeAt(0);
 const CC_UPPER_A = "A".charCodeAt(0);
 const CC_UPPER_F = "F".charCodeAt(0);
 const CC_UPPER_E = "E".charCodeAt(0);
-const CC_UPPER_U = "E".charCodeAt(0);
+const CC_UPPER_U = "U".charCodeAt(0);
 const CC_UPPER_Z = "Z".charCodeAt(0);
 const CC_0 = "0".charCodeAt(0);
 const CC_9 = "9".charCodeAt(0);
@@ -1197,6 +1197,102 @@ module.exports = (input, pos = 0, callbacks = {}) => {
 	return pos;
 };
 
+/**
+ * @param {string} input input css
+ * @param {number} pos pos
+ * @param {CssTokenCallbacks} callbacks callbacks
+ * @param {CssTokenCallbacks} additional additional callbacks
+ * @param {{ onlyTopLevel?: boolean, declarationValue?: boolean, atRulePrelude?: boolean, functionValue?: boolean }=} options options
+ * @returns {number} pos
+ */
+const consumeUntil = (input, pos, callbacks, additional, options = {}) => {
+	let needHandle = true;
+	let needTerminate = false;
+
+	/** @type {CssTokenCallbacks} */
+	const servicedCallbacks = {};
+
+	let balanced = 0;
+
+	if (options.onlyTopLevel) {
+		servicedCallbacks.function = (input, start, end) => {
+			balanced++;
+			if (!options.functionValue) {
+				needHandle = false;
+			}
+
+			if (additional.function !== undefined) {
+				return additional.function(input, start, end);
+			}
+
+			return end;
+		};
+
+		servicedCallbacks.leftParenthesis = (_input, _start, end) => {
+			balanced++;
+			needHandle = false;
+			return end;
+		};
+		servicedCallbacks.rightParenthesis = (_input, _start, end) => {
+			balanced--;
+			if (balanced === 0) {
+				needHandle = true;
+			}
+			return end;
+		};
+	}
+
+	if (options.declarationValue) {
+		servicedCallbacks.semicolon = (_input, _start, end) => {
+			needTerminate = true;
+			return end;
+		};
+
+		servicedCallbacks.rightCurlyBracket = (_input, _start, end) => {
+			needTerminate = true;
+			return end;
+		};
+	} else if (options.functionValue) {
+		servicedCallbacks.rightParenthesis = (_input, _start, end) => {
+			balanced--;
+			if (balanced === 0) {
+				needTerminate = true;
+			}
+			return end;
+		};
+	} else if (options.atRulePrelude) {
+		servicedCallbacks.leftCurlyBracket = (_input, _start, end) => {
+			needTerminate = true;
+			return end;
+		};
+	}
+
+	while (pos < input.length) {
+		// Consume comments.
+		pos = consumeComments(
+			input,
+			pos,
+			needHandle ? { ...servicedCallbacks, ...callbacks } : servicedCallbacks
+		);
+
+		const start = pos;
+
+		// Consume the next input code point.
+		pos++;
+		pos = consumeAToken(
+			input,
+			pos,
+			needHandle ? { ...servicedCallbacks, ...callbacks } : servicedCallbacks
+		);
+
+		if (needTerminate) {
+			return start;
+		}
+	}
+
+	return pos;
+};
+
 /**
  * @param {string} input input
  * @param {number} pos position
@@ -1608,6 +1704,7 @@ const eatUntil = (chars) => {
 	};
 };
 
+module.exports.consumeUntil = consumeUntil;
 module.exports.eatComments = eatComments;
 module.exports.eatIdentSequence = eatIdentSequence;
 module.exports.eatIdentSequenceOrString = eatIdentSequenceOrString;

package/lib/dependencies/CommonJsImportsParserPlugin.js

@@ -126,15 +126,6 @@ class CommonJsImportsParserPlugin {
 		});
 
 		// #region Unsupported
-		parser.hooks.expression
-			.for("require.main")
-			.tap(
-				PLUGIN_NAME,
-				expressionIsUnsupported(
-					parser,
-					"require.main is not supported by webpack."
-				)
-			);
 		parser.hooks.call
 			.for("require.main.require")
 			.tap(

package/lib/dependencies/CommonJsPlugin.js

@@ -15,6 +15,7 @@ const SelfModuleFactory = require("../SelfModuleFactory");
 const Template = require("../Template");
 const {
 	evaluateToIdentifier,
+	expressionIsUnsupported,
 	toConstantDependency
 } = require("../javascript/JavascriptParserHelpers");
 const CommonJsExportRequireDependency = require("./CommonJsExportRequireDependency");
@@ -198,6 +199,17 @@ class CommonJsPlugin {
 								[RuntimeGlobals.moduleCache, RuntimeGlobals.entryModuleId]
 							)
 						);
+
+					parser.hooks.expression
+						.for("require.extensions")
+						.tap(
+							PLUGIN_NAME,
+							expressionIsUnsupported(
+								parser,
+								"require.extensions is not supported by webpack. Use a loader instead."
+							)
+						);
+
 					parser.hooks.expression
 						.for(RuntimeGlobals.moduleLoaded)
 						.tap(PLUGIN_NAME, (expr) => {

package/lib/dependencies/ContextElementDependency.js

@@ -68,8 +68,8 @@ class ContextElementDependency extends ModuleDependency {
 	 */
 	getResourceIdentifier() {
 		let str = super.getResourceIdentifier();
-		if (this.attributes !== undefined) {
-			str += JSON.stringify(this.attributes);
+		if (this.attributes) {
+			str += `|importAttributes${JSON.stringify(this.attributes)}`;
 		}
 		return str;
 	}

package/lib/dependencies/CssIcssExportDependency.js

@@ -6,11 +6,18 @@
 "use strict";
 
 const { cssExportConvention } = require("../util/conventions");
+const createHash = require("../util/createHash");
+const { makePathsRelative } = require("../util/identifier");
 const makeSerializable = require("../util/makeSerializable");
+const memoize = require("../util/memoize");
+const CssIcssImportDependency = require("./CssIcssImportDependency");
 const NullDependency = require("./NullDependency");
 
+const getCssParser = memoize(() => require("../css/CssParser"));
+
 /** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
 /** @typedef {import("../../declarations/WebpackOptions").CssGeneratorExportsConvention} CssGeneratorExportsConvention */
+/** @typedef {import("../../declarations/WebpackOptions").CssGeneratorLocalIdentName} CssGeneratorLocalIdentName */
 /** @typedef {import("../CssModule")} CssModule */
 /** @typedef {import("../Dependency")} Dependency */
 /** @typedef {import("../Dependency").ExportsSpec} ExportsSpec */
@@ -21,16 +28,82 @@ const NullDependency = require("./NullDependency");
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
 /** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
 /** @typedef {import("../util/Hash")} Hash */
+/** @typedef {import("../ChunkGraph")} ChunkGraph */
+/** @typedef {import("../RuntimeTemplate")} RuntimeTemplate */
+/** @typedef {import("../css/CssParser").Range} Range */
+
+/**
+ * @param {string} local css local
+ * @param {CssModule} module module
+ * @param {ChunkGraph} chunkGraph chunk graph
+ * @param {RuntimeTemplate} runtimeTemplate runtime template
+ * @returns {string} local ident
+ */
+const getLocalIdent = (local, module, chunkGraph, runtimeTemplate) => {
+	const generator = /** @type {CssGenerator} */ (module.generator);
+	const localIdentName =
+		/** @type {CssGeneratorLocalIdentName} */
+		(generator.localIdentName);
+	const relativeResourcePath = makePathsRelative(
+		/** @type {string} */
+		(module.context),
+		/** @type {string} */
+		(module.getResource()),
+		runtimeTemplate.compilation.compiler.root
+	);
+	const { hashFunction, hashDigest, hashDigestLength, hashSalt, uniqueName } =
+		runtimeTemplate.outputOptions;
+	const hash = createHash(hashFunction);
+
+	if (hashSalt) {
+		hash.update(hashSalt);
+	}
+
+	hash.update(relativeResourcePath);
+
+	if (!/\[local\]/.test(localIdentName)) {
+		hash.update(local);
+	}
+
+	const localIdentHash = hash.digest(hashDigest).slice(0, hashDigestLength);
+
+	return runtimeTemplate.compilation
+		.getPath(localIdentName, {
+			filename: relativeResourcePath,
+			hash: localIdentHash,
+			contentHash: localIdentHash,
+			chunkGraph,
+			module
+		})
+		.replace(/\[local\]/g, local)
+		.replace(/\[uniqueName\]/g, /** @type {string} */ (uniqueName))
+		.replace(/^((-?[0-9])|--)/, "_$1");
+};
+// 0 - replace, 1 - append, 2 - once
+/** @typedef {0 | 1 | 2} ExportMode */
+// 0 - none, 1 - name, 1 - value
+/** @typedef {0 | 1 | 2} InterpolationMode */
 
 class CssIcssExportDependency extends NullDependency {
 	/**
-	 * @param {string} name name
-	 * @param {string} value value
+	 * Example of dependency:
+	 *
+	 * :export { LOCAL_NAME: EXPORT_NAME }
+	 * @param {string} name export name
+	 * @param {string} value export value or true when we need interpolate name as a value
+	 * @param {string=} reexport reexport name
+	 * @param {Range=} range range
 	 */
-	constructor(name, value) {
+	constructor(name, value, reexport, range) {
 		super();
 		this.name = name;
 		this.value = value;
+		this.reexport = reexport;
+		this.range = range;
+		/** @type {undefined | InterpolationMode} */
+		this.interpolationMode = undefined;
+		/** @type {ExportMode} */
+		this.exportMode = CssIcssExportDependency.EXPORT_MODE.REPLACE;
 		this._hashUpdate = undefined;
 	}
 
@@ -90,9 +163,8 @@ class CssIcssExportDependency extends NullDependency {
 				/** @type {CssGeneratorExportsConvention} */
 				(generator.convention)
 			);
-			this._hashUpdate = JSON.stringify(names);
+			this._hashUpdate = `exportsConvention|${JSON.stringify(names)}|localIdentName|${JSON.stringify(generator.localIdentName)}`;
 		}
-		hash.update("exportsConvention");
 		hash.update(this._hashUpdate);
 	}
 
@@ -103,6 +175,10 @@ class CssIcssExportDependency extends NullDependency {
 		const { write } = context;
 		write(this.name);
 		write(this.value);
+		write(this.reexport);
+		write(this.range);
+		write(this.interpolationMode);
+		write(this.exportMode);
 		super.serialize(context);
 	}
 
@@ -113,6 +189,10 @@ class CssIcssExportDependency extends NullDependency {
 		const { read } = context;
 		this.name = read();
 		this.value = read();
+		this.reexport = read();
+		this.range = read();
+		this.interpolationMode = read();
+		this.exportMode = read();
 		super.deserialize(context);
 	}
 }
@@ -120,14 +200,111 @@ class CssIcssExportDependency extends NullDependency {
 CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends (
 	NullDependency.Template
 ) {
+	// TODO looking how to cache
+	/**
+	 * @param {string} symbol the name of symbol
+	 * @param {DependencyTemplateContext} templateContext the context object
+	 * @returns {string | undefined} found reference
+	 */
+	static findReference(symbol, templateContext) {
+		for (const item of templateContext.module.dependencies) {
+			if (item instanceof CssIcssImportDependency) {
+				// Looking for the referring module
+				const module = templateContext.moduleGraph.getModule(item);
+
+				if (!module) {
+					return undefined;
+				}
+
+				for (let i = module.dependencies.length - 1; i >= 0; i--) {
+					const nestedDep = module.dependencies[i];
+					if (
+						nestedDep instanceof CssIcssExportDependency &&
+						symbol === nestedDep.name
+					) {
+						if (nestedDep.reexport) {
+							return this.findReference(nestedDep.reexport, {
+								...templateContext,
+								module
+							});
+						}
+
+						return CssIcssExportDependency.Template.getIdentifier(nestedDep, {
+							...templateContext,
+							module
+						});
+					}
+				}
+			}
+		}
+	}
+
+	/**
+	 * @param {Dependency} dependency the dependency for which the template should be applied
+	 * @param {DependencyTemplateContext} templateContext the context object
+	 * @returns {string} identifier
+	 */
+	static getIdentifier(dependency, templateContext) {
+		const dep = /** @type {CssIcssExportDependency} */ (dependency);
+
+		if (
+			dep.interpolationMode ===
+				CssIcssExportDependency.INTERPOLATION_MODE.NAME ||
+			dep.interpolationMode === CssIcssExportDependency.INTERPOLATION_MODE.VALUE
+		) {
+			const { module: m, moduleGraph, runtime } = templateContext;
+			const module = /** @type {CssModule} */ (m);
+			const generator = /** @type {CssGenerator} */ (module.generator);
+			const names = dep.getExportsConventionNames(
+				dep.interpolationMode ===
+					CssIcssExportDependency.INTERPOLATION_MODE.NAME
+					? dep.name
+					: dep.value,
+				/** @type {CssGeneratorExportsConvention} */
+				(generator.convention)
+			);
+			const usedNames =
+				/** @type {string[]} */
+				(
+					names
+						.map((name) =>
+							moduleGraph.getExportInfo(module, name).getUsedName(name, runtime)
+						)
+						.filter(Boolean)
+				);
+			const local = usedNames.length === 0 ? names[0] : usedNames[0];
+			const prefix =
+				/** @type {CssIcssExportDependency & { prefix: string }} */
+				(dependency).prefix;
+
+			return (
+				(prefix || "") +
+				getCssParser().escapeIdentifier(
+					getLocalIdent(
+						local,
+						/** @type {CssModule} */
+						(templateContext.module),
+						templateContext.chunkGraph,
+						templateContext.runtimeTemplate
+					)
+				)
+			);
+		}
+
+		return /** @type {string} */ (dep.value);
+	}
+
 	/**
 	 * @param {Dependency} dependency the dependency for which the template should be applied
 	 * @param {ReplaceSource} source the current replace source which can be modified
 	 * @param {DependencyTemplateContext} templateContext the context object
 	 * @returns {void}
 	 */
-	apply(dependency, source, { cssData, module: m, runtime, moduleGraph }) {
+	apply(dependency, source, templateContext) {
 		const dep = /** @type {CssIcssExportDependency} */ (dependency);
+		if (!dep.range && templateContext.type !== "javascript") return;
+		const { cssData } = templateContext;
+		const { module: m, moduleGraph, runtime } = templateContext;
 		const module = /** @type {CssModule} */ (m);
 		const generator = /** @type {CssGenerator} */ (module.generator);
 		const names = dep.getExportsConventionNames(
@@ -145,12 +322,74 @@ CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends
 					.filter(Boolean)
 			);
 
-		for (const used of [...usedNames, ...names]) {
-			cssData.exports.set(used, dep.value);
+		const allNames = new Set([...usedNames, ...names]);
+
+		/** @type {string} */
+		let value;
+
+		if (dep.reexport) {
+			const resolved = CssIcssExportDependencyTemplate.findReference(
+				dep.reexport,
+				templateContext
+			);
+
+			if (resolved) {
+				dep.value = resolved;
+			}
+		}
+
+		if (typeof dep.interpolationMode !== "undefined") {
+			value = CssIcssExportDependencyTemplate.getIdentifier(
+				dep,
+				templateContext
+			);
+		} else {
+			value = dep.value;
+		}
+
+		if (templateContext.type === "javascript") {
+			for (const used of allNames) {
+				if (dep.exportMode === 2) {
+					if (cssData.exports.has(used)) return;
+					cssData.exports.set(
+						used,
+						`${getCssParser().unescapeIdentifier(value)}`
+					);
+				} else {
+					const originalValue =
+						dep.exportMode === 0 ? undefined : cssData.exports.get(used);
+					const newValue = getCssParser().unescapeIdentifier(value);
+
+					cssData.exports.set(
+						used,
+						`${originalValue ? `${originalValue}${newValue ? " " : ""}` : ""}${newValue}`
+					);
+				}
+			}
+		} else if (
+			dep.range &&
+			templateContext.type === "css" &&
+			dep.exportMode !== 1
+		) {
+			source.replace(dep.range[0], dep.range[1] - 1, value);
 		}
 	}
 };
 
+/** @type {Record<"REPLACE" | "APPEND" | "ONCE", ExportMode>} */
+CssIcssExportDependency.EXPORT_MODE = {
+	REPLACE: 0,
+	APPEND: 1,
+	ONCE: 2
+};
+
+/** @type {Record<"NONE" | "NAME" | "VALUE", InterpolationMode>} */
+CssIcssExportDependency.INTERPOLATION_MODE = {
+	NONE: 0,
+	NAME: 1,
+	VALUE: 2
+};
+
 makeSerializable(
 	CssIcssExportDependency,
 	"webpack/lib/dependencies/CssIcssExportDependency"

package/lib/dependencies/CssIcssFromIdentifierDependency.js

@@ -0,0 +1,124 @@
+/*
+	MIT License http://www.opensource.org/licenses/mit-license.php
+	Author Alexander Akait @alexander-akait
+*/
+
+"use strict";
+
+const { cssExportConvention } = require("../util/conventions");
+const makeSerializable = require("../util/makeSerializable");
+const CssIcssExportDependency = require("./CssIcssExportDependency");
+const CssIcssImportDependency = require("./CssIcssImportDependency");
+const ModuleDependency = require("./ModuleDependency");
+
+/** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
+/** @typedef {import("../Dependency")} Dependency */
+/** @typedef {import("../Dependency").ReferencedExports} ReferencedExports */
+/** @typedef {import("../ModuleGraph")} ModuleGraph */
+/** @typedef {import("../DependencyTemplate").CssDependencyTemplateContext} DependencyTemplateContext */
+/** @typedef {import("../Module")} Module */
+/** @typedef {import("../CssModule")} CssModule */
+/** @typedef {import("../javascript/JavascriptParser").Range} Range */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
+/** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
+/** @typedef {import("../../declarations/WebpackOptions").CssGeneratorExportsConvention} CssGeneratorExportsConvention */
+/** @typedef {import("../css/CssGenerator")} CssGenerator */
+/** @typedef {import("../util/runtime").RuntimeSpec} RuntimeSpec */
+
+class CssIcssFromIdentifierDependency extends CssIcssImportDependency {
+	/**
+	 * @param {string} request request request path which needs resolving
+	 * @param {"local" | "global"} mode mode of the parsed CSS
+	 * @param {Range} range the range of dependency
+	 * @param {string} name import class name
+	 * @param {string} exportName export class name
+	 * @param {string=} prefix prefix
+	 */
+	constructor(request, mode, range, name, exportName, prefix) {
+		super(request, range, mode, name);
+		this.exportName = exportName;
+		this.value = name;
+		this.prefix = prefix;
+		this.interpolationMode = CssIcssExportDependency.INTERPOLATION_MODE.VALUE;
+		this.exportMode = CssIcssExportDependency.EXPORT_MODE.APPEND;
+	}
+
+	get type() {
+		return "css from identifier";
+	}
+
+	/**
+	 * @returns {string | null} an identifier to merge equal requests
+	 */
+	getResourceIdentifier() {
+		return `${super.getResourceIdentifier()}|exportName${this.exportName}|prefix${this.prefix}`;
+	}
+
+	/**
+	 * @param {string} name export name
+	 * @param {CssGeneratorExportsConvention} convention convention of the export name
+	 * @returns {string[]} convention results
+	 */
+	getExportsConventionNames(name, convention) {
+		return cssExportConvention(name, convention);
+	}
+
+	/**
+	 * @param {ObjectSerializerContext} context context
+	 */
+	serialize(context) {
+		const { write } = context;
+		write(this.exportName);
+		write(this.prefix);
+		write(this.interpolationMode);
+		write(this.exportMode);
+		super.serialize(context);
+	}
+
+	/**
+	 * @param {ObjectDeserializerContext} context context
+	 */
+	deserialize(context) {
+		const { read } = context;
+		this.exportName = read();
+		this.prefix = read();
+		this.interpolationMode = read();
+		this.exportMode = read();
+		super.deserialize(context);
+	}
+}
+
+CssIcssFromIdentifierDependency.Template = class CssIcssFromIdentifierDependencyTemplate extends (
+	ModuleDependency.Template
+) {
+	/**
+	 * @param {Dependency} dependency the dependency for which the template should be applied
+	 * @param {ReplaceSource} source the current replace source which can be modified
+	 * @param {DependencyTemplateContext} templateContext the context object
+	 * @returns {void}
+	 */
+	apply(dependency, source, templateContext) {
+		const { moduleGraph } = templateContext;
+		const dep = /** @type {CssIcssFromIdentifierDependency} */ (dependency);
+		const module =
+			/** @type {CssModule} */
+			(moduleGraph.getModule(dep));
+
+		if (!moduleGraph.getExportsInfo(module).isExportProvided(dep.name)) {
+			return;
+		}
+
+		const template = new CssIcssExportDependency.Template();
+		const originalName = dep.name;
+		dep.name = dep.exportName;
+		template.apply(dep, source, { ...templateContext, module });
+		dep.name = originalName;
+	}
+};
+
+makeSerializable(
+	CssIcssFromIdentifierDependency,
+	"webpack/lib/dependencies/CssIcssFromIdentifierDependency"
+);
+
+module.exports = CssIcssFromIdentifierDependency;

package/lib/dependencies/CssIcssGlobalIdentifierDependency.js

@@ -0,0 +1,48 @@
+/*
+	MIT License http://www.opensource.org/licenses/mit-license.php
+	Author Alexander Akait @alexander-akait
+*/
+
+"use strict";
+
+const makeSerializable = require("../util/makeSerializable");
+const CssIcssExportDependency = require("./CssIcssExportDependency");
+
+/** @typedef {import("../css/CssParser").Range} Range */
+/** @typedef {import("../ModuleGraph")} ModuleGraph */
+/** @typedef {import("../Dependency").ExportsSpec} ExportsSpec */
+
+class CssIcssGlobalIdentifierDependency extends CssIcssExportDependency {
+	/**
+	 * @param {string} name export identifier name
+	 * @param {string} value identifier value
+	 * @param {string | undefined} reexport reexport name
+	 * @param {Range} range the range of dependency
+	 */
+	constructor(name, value, reexport, range) {
+		super(name, value, reexport, range);
+		this.exportMode = CssIcssExportDependency.EXPORT_MODE.APPEND;
+	}
+
+	get type() {
+		return "css global identifier";
+	}
+
+	/**
+	 * Returns the exported names
+	 * @param {ModuleGraph} moduleGraph module graph
+	 * @returns {ExportsSpec | undefined} export names
+	 */
+	getExports(moduleGraph) {
+		return undefined;
+	}
+}
+
+CssIcssGlobalIdentifierDependency.Template = CssIcssExportDependency.Template;
+
+makeSerializable(
+	CssIcssGlobalIdentifierDependency,
+	"webpack/lib/dependencies/CssIcssGlobalDependency"
+);
+
+module.exports = CssIcssGlobalIdentifierDependency;