webpack 5.64.3 → 5.67.0

package/lib/asset/AssetModulesPlugin.js

@@ -137,9 +137,11 @@ class AssetModulesPlugin {
 
 							let filename = undefined;
 							let publicPath = undefined;
+							let outputPath = undefined;
 							if (type !== "asset/inline") {
 								filename = generatorOptions.filename;
 								publicPath = generatorOptions.publicPath;
+								outputPath = generatorOptions.outputPath;
 							}
 
 							const AssetGenerator = getAssetGenerator();
@@ -148,6 +150,7 @@ class AssetModulesPlugin {
 								dataUrl,
 								filename,
 								publicPath,
+								outputPath,
 								generatorOptions.emit !== false
 							);
 						});

package/lib/asset/RawDataUrlModule.js

@@ -0,0 +1,148 @@
+/*
+	MIT License http://www.opensource.org/licenses/mit-license.php
+	Author Tobias Koppers @sokra
+*/
+
+"use strict";
+
+const { RawSource } = require("webpack-sources");
+const Module = require("../Module");
+const RuntimeGlobals = require("../RuntimeGlobals");
+const makeSerializable = require("../util/makeSerializable");
+
+/** @typedef {import("../../declarations/WebpackOptions").WebpackOptionsNormalized} WebpackOptions */
+/** @typedef {import("../Compilation")} Compilation */
+/** @typedef {import("../Dependency").UpdateHashContext} UpdateHashContext */
+/** @typedef {import("../Module").CodeGenerationContext} CodeGenerationContext */
+/** @typedef {import("../Module").CodeGenerationResult} CodeGenerationResult */
+/** @typedef {import("../Module").NeedBuildContext} NeedBuildContext */
+/** @typedef {import("../RequestShortener")} RequestShortener */
+/** @typedef {import("../ResolverFactory").ResolverWithOptions} ResolverWithOptions */
+/** @typedef {import("../WebpackError")} WebpackError */
+/** @typedef {import("../util/Hash")} Hash */
+/** @typedef {import("../util/fs").InputFileSystem} InputFileSystem */
+
+const TYPES = new Set(["javascript"]);
+
+class RawDataUrlModule extends Module {
+	/**
+	 * @param {string} url raw url
+	 * @param {string} identifier unique identifier
+	 * @param {string=} readableIdentifier readable identifier
+	 */
+	constructor(url, identifier, readableIdentifier) {
+		super("asset/raw-data-url", null);
+		this.url = url;
+		this.urlBuffer = url ? Buffer.from(url) : undefined;
+		this.identifierStr = identifier || this.url;
+		this.readableIdentifierStr = readableIdentifier || this.identifierStr;
+	}
+
+	/**
+	 * @returns {Set<string>} types available (do not mutate)
+	 */
+	getSourceTypes() {
+		return TYPES;
+	}
+
+	/**
+	 * @returns {string} a unique identifier of the module
+	 */
+	identifier() {
+		return this.identifierStr;
+	}
+
+	/**
+	 * @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)
+	 */
+	size(type) {
+		if (this.url === undefined) this.url = this.urlBuffer.toString();
+		return Math.max(1, this.url.length);
+	}
+
+	/**
+	 * @param {RequestShortener} requestShortener the request shortener
+	 * @returns {string} a user readable identifier of the module
+	 */
+	readableIdentifier(requestShortener) {
+		return requestShortener.shorten(this.readableIdentifierStr);
+	}
+
+	/**
+	 * @param {NeedBuildContext} context context info
+	 * @param {function((WebpackError | null)=, boolean=): void} callback callback function, returns true, if the module needs a rebuild
+	 * @returns {void}
+	 */
+	needBuild(context, callback) {
+		return callback(null, !this.buildMeta);
+	}
+
+	/**
+	 * @param {WebpackOptions} options webpack options
+	 * @param {Compilation} compilation the compilation
+	 * @param {ResolverWithOptions} resolver the resolver
+	 * @param {InputFileSystem} fs the file system
+	 * @param {function(WebpackError=): void} callback callback function
+	 * @returns {void}
+	 */
+	build(options, compilation, resolver, fs, callback) {
+		this.buildMeta = {};
+		this.buildInfo = {
+			cacheable: true
+		};
+		callback();
+	}
+
+	/**
+	 * @param {CodeGenerationContext} context context for code generation
+	 * @returns {CodeGenerationResult} result
+	 */
+	codeGeneration(context) {
+		if (this.url === undefined) this.url = this.urlBuffer.toString();
+		const sources = new Map();
+		sources.set(
+			"javascript",
+			new RawSource(`module.exports = ${JSON.stringify(this.url)};`)
+		);
+		const data = new Map();
+		data.set("url", this.urlBuffer);
+		const runtimeRequirements = new Set();
+		runtimeRequirements.add(RuntimeGlobals.module);
+		return { sources, runtimeRequirements, data };
+	}
+
+	/**
+	 * @param {Hash} hash the hash used to track dependencies
+	 * @param {UpdateHashContext} context context
+	 * @returns {void}
+	 */
+	updateHash(hash, context) {
+		hash.update(this.urlBuffer);
+		super.updateHash(hash, context);
+	}
+
+	serialize(context) {
+		const { write } = context;
+
+		write(this.urlBuffer);
+		write(this.identifierStr);
+		write(this.readableIdentifierStr);
+
+		super.serialize(context);
+	}
+
+	deserialize(context) {
+		const { read } = context;
+
+		this.urlBuffer = read();
+		this.identifierStr = read();
+		this.readableIdentifierStr = read();
+
+		super.deserialize(context);
+	}
+}
+
+makeSerializable(RawDataUrlModule, "webpack/lib/asset/RawDataUrlModule");
+
+module.exports = RawDataUrlModule;

package/lib/cache/ResolverCachePlugin.js

@@ -106,7 +106,7 @@ class ResolverCachePlugin {
 		 * @param {Resolver} resolver the resolver
 		 * @param {Object} resolveContext context for resolving meta info
 		 * @param {Object} request the request info object
-		 * @param {function(Error=, Object=): void} callback callback function
+		 * @param {function((Error | null)=, Object=): void} callback callback function
 		 * @returns {void}
 		 */
 		const doRealResolve = (

package/lib/cli.js

@@ -37,6 +37,7 @@ const webpackSchema = require("../schemas/WebpackOptions.json");
 /**
  * @typedef {Object} ArgumentConfig
  * @property {string} description
+ * @property {string} [negatedDescription]
  * @property {string} path
  * @property {boolean} multiple
  * @property {"enum"|"string"|"path"|"number"|"boolean"|"RegExp"|"reset"} type
@@ -96,11 +97,42 @@ const getArguments = (schema = webpackSchema) => {
 	 */
 	const getDescription = path => {
 		for (const { schema } of path) {
-			if (schema.cli && schema.cli.helper) continue;
+			if (schema.cli) {
+				if (schema.cli.helper) continue;
+				if (schema.cli.description) return schema.cli.description;
+			}
 			if (schema.description) return schema.description;
 		}
 	};
 
+	/**
+	 *
+	 * @param {PathItem[]} path path in the schema
+	 * @returns {string | undefined} negative description
+	 */
+	const getNegatedDescription = path => {
+		for (const { schema } of path) {
+			if (schema.cli) {
+				if (schema.cli.helper) continue;
+				if (schema.cli.negatedDescription) return schema.cli.negatedDescription;
+			}
+		}
+	};
+
+	/**
+	 *
+	 * @param {PathItem[]} path path in the schema
+	 * @returns {string | undefined} reset description
+	 */
+	const getResetDescription = path => {
+		for (const { schema } of path) {
+			if (schema.cli) {
+				if (schema.cli.helper) continue;
+				if (schema.cli.resetDescription) return schema.cli.resetDescription;
+			}
+		}
+	};
+
 	/**
 	 *
 	 * @param {any} schemaPart schema
@@ -142,13 +174,17 @@ const getArguments = (schema = webpackSchema) => {
 	const addResetFlag = path => {
 		const schemaPath = path[0].path;
 		const name = pathToArgumentName(`${schemaPath}.reset`);
-		const description = getDescription(path);
+		const description =
+			getResetDescription(path) ||
+			`Clear all items provided in '${schemaPath}' configuration. ${getDescription(
+				path
+			)}`;
 		flags[name] = {
 			configs: [
 				{
 					type: "reset",
 					multiple: false,
-					description: `Clear all items provided in '${schemaPath}' configuration. ${description}`,
+					description,
 					path: schemaPath
 				}
 			],
@@ -167,6 +203,7 @@ const getArguments = (schema = webpackSchema) => {
 		const argConfigBase = schemaToArgumentConfig(path[0].schema);
 		if (!argConfigBase) return 0;
 
+		const negatedDescription = getNegatedDescription(path);
 		const name = pathToArgumentName(path[0].path);
 		/** @type {ArgumentConfig} */
 		const argConfig = {
@@ -176,6 +213,10 @@ const getArguments = (schema = webpackSchema) => {
 			path: path[0].path
 		};
 
+		if (negatedDescription) {
+			argConfig.negatedDescription = negatedDescription;
+		}
+
 		if (!flags[name]) {
 			flags[name] = {
 				configs: [],

package/lib/config/browserslistTargetHandler.js

@@ -274,7 +274,44 @@ const resolve = browsers => {
 			// kaios: Unknown support
 			node: [12, 0]
 		}),
-
+		optionalChaining: rawChecker({
+			chrome: 80,
+			and_chr: 80,
+			edge: 80,
+			firefox: 74,
+			and_ff: 79,
+			// ie: Not supported,
+			opera: 67,
+			op_mob: 64,
+			safari: [13, 1],
+			ios_saf: [13, 4],
+			samsung: 13,
+			android: 80,
+			// and_qq: Not supported
+			// baidu: Not supported
+			// and_uc: Not supported
+			// kaios: Not supported
+			node: 14
+		}),
+		templateLiteral: rawChecker({
+			chrome: 41,
+			and_chr: 41,
+			edge: 13,
+			firefox: 34,
+			and_ff: 34,
+			// ie: Not supported,
+			opera: 29,
+			op_mob: 64,
+			safari: [9, 1],
+			ios_saf: 9,
+			samsung: 4,
+			android: 41,
+			and_qq: [10, 4],
+			baidu: [7, 12],
+			and_uc: [12, 12],
+			kaios: [2, 5],
+			node: 4
+		}),
 		browser: browserProperty,
 		electron: false,
 		node: nodeProperty,

package/lib/config/defaults.js

@@ -16,6 +16,7 @@ const {
 } = require("./target");
 
 /** @typedef {import("../../declarations/WebpackOptions").CacheOptionsNormalized} CacheOptions */
+/** @typedef {import("../../declarations/WebpackOptions").CssExperimentOptions} CssExperimentOptions */
 /** @typedef {import("../../declarations/WebpackOptions").EntryDescription} EntryDescription */
 /** @typedef {import("../../declarations/WebpackOptions").EntryNormalized} Entry */
 /** @typedef {import("../../declarations/WebpackOptions").Experiments} Experiments */
@@ -160,7 +161,11 @@ const applyWebpackOptionsDefaults = options => {
 	D(options, "recordsInputPath", false);
 	D(options, "recordsOutputPath", false);
 
-	applyExperimentsDefaults(options.experiments, { production, development });
+	applyExperimentsDefaults(options.experiments, {
+		production,
+		development,
+		targetProperties
+	});
 
 	const futureDefaults = options.experiments.futureDefaults;
 
@@ -184,6 +189,7 @@ const applyWebpackOptionsDefaults = options => {
 		cache,
 		syncWebAssembly: options.experiments.syncWebAssembly,
 		asyncWebAssembly: options.experiments.asyncWebAssembly,
+		css: options.experiments.css,
 		futureDefaults
 	});
 
@@ -239,6 +245,7 @@ const applyWebpackOptionsDefaults = options => {
 	applyOptimizationDefaults(options.optimization, {
 		development,
 		production,
+		css: options.experiments.css,
 		records: !!(options.recordsInputPath || options.recordsOutputPath)
 	});
 
@@ -263,9 +270,13 @@ const applyWebpackOptionsDefaults = options => {
  * @param {Object} options options
  * @param {boolean} options.production is production
  * @param {boolean} options.development is development mode
+ * @param {TargetProperties | false} options.targetProperties target properties
  * @returns {void}
  */
-const applyExperimentsDefaults = (experiments, { production, development }) => {
+const applyExperimentsDefaults = (
+	experiments,
+	{ production, development, targetProperties }
+) => {
 	D(experiments, "futureDefaults", false);
 	D(experiments, "backCompat", !experiments.futureDefaults);
 	D(experiments, "topLevelAwait", experiments.futureDefaults);
@@ -276,11 +287,20 @@ const applyExperimentsDefaults = (experiments, { production, development }) => {
 	D(experiments, "lazyCompilation", undefined);
 	D(experiments, "buildHttp", undefined);
 	D(experiments, "cacheUnaffected", experiments.futureDefaults);
+	F(experiments, "css", () => (experiments.futureDefaults ? {} : undefined));
 
 	if (typeof experiments.buildHttp === "object") {
 		D(experiments.buildHttp, "frozen", production);
 		D(experiments.buildHttp, "upgrade", false);
 	}
+
+	if (typeof experiments.css === "object") {
+		D(
+			experiments.css,
+			"exportsOnly",
+			!targetProperties || !targetProperties.document
+		);
+	}
 };
 
 /**
@@ -458,12 +478,13 @@ const applyJavascriptParserOptionsDefaults = (
  * @param {boolean} options.cache is caching enabled
  * @param {boolean} options.syncWebAssembly is syncWebAssembly enabled
  * @param {boolean} options.asyncWebAssembly is asyncWebAssembly enabled
+ * @param {CssExperimentOptions} options.css is css enabled
  * @param {boolean} options.futureDefaults is future defaults enabled
  * @returns {void}
  */
 const applyModuleDefaults = (
 	module,
-	{ cache, syncWebAssembly, asyncWebAssembly, futureDefaults }
+	{ cache, syncWebAssembly, asyncWebAssembly, css, futureDefaults }
 ) => {
 	if (cache) {
 		D(module, "unsafeCache", module => {
@@ -587,6 +608,41 @@ const applyModuleDefaults = (
 				...wasm
 			});
 		}
+		if (css) {
+			const cssRule = {
+				type: "css",
+				resolve: {
+					fullySpecified: true,
+					preferRelative: true
+				}
+			};
+			const cssModulesRule = {
+				type: "css/module",
+				resolve: {
+					fullySpecified: true
+				}
+			};
+			rules.push({
+				test: /\.css$/i,
+				oneOf: [
+					{
+						test: /\.module\.css$/i,
+						...cssModulesRule
+					},
+					{
+						...cssRule
+					}
+				]
+			});
+			rules.push({
+				mimetype: "text/css+module",
+				...cssModulesRule
+			});
+			rules.push({
+				mimetype: "text/css",
+				...cssRule
+			});
+		}
 		rules.push(
 			{
 				dependency: "url",
@@ -692,6 +748,20 @@ const applyOutputDefaults = (
 		}
 		return output.module ? "[id].mjs" : "[id].js";
 	});
+	F(output, "cssFilename", () => {
+		const filename = output.filename;
+		if (typeof filename !== "function") {
+			return filename.replace(/\.[mc]?js(\?|$)/, ".css$1");
+		}
+		return "[id].css";
+	});
+	F(output, "cssChunkFilename", () => {
+		const chunkFilename = output.chunkFilename;
+		if (typeof chunkFilename !== "function") {
+			return chunkFilename.replace(/\.[mc]?js(\?|$)/, ".css$1");
+		}
+		return "[id].css";
+	});
 	D(output, "assetModuleFilename", "[hash][ext][query]");
 	D(output, "webassemblyModuleFilename", "[hash].module.wasm");
 	D(output, "compareBeforeEmit", true);
@@ -832,7 +902,7 @@ const applyOutputDefaults = (
 	D(output, "chunkLoadTimeout", 120000);
 	D(output, "hashFunction", futureDefaults ? "xxhash64" : "md4");
 	D(output, "hashDigest", "hex");
-	D(output, "hashDigestLength", 20);
+	D(output, "hashDigestLength", futureDefaults ? 16 : 20);
 	D(output, "strictModuleExceptionHandling", false);
 
 	const optimistic = v => v || v === undefined;
@@ -1030,12 +1100,13 @@ const applyPerformanceDefaults = (performance, { production }) => {
  * @param {Object} options options
  * @param {boolean} options.production is production
  * @param {boolean} options.development is development
+ * @param {CssExperimentOptions} options.css is css enabled
  * @param {boolean} options.records using records
  * @returns {void}
  */
 const applyOptimizationDefaults = (
 	optimization,
-	{ production, development, records }
+	{ production, development, css, records }
 ) => {
 	D(optimization, "removeAvailableModules", false);
 	D(optimization, "removeEmptyChunks", true);
@@ -1086,7 +1157,9 @@ const applyOptimizationDefaults = (
 	});
 	const { splitChunks } = optimization;
 	if (splitChunks) {
-		A(splitChunks, "defaultSizeTypes", () => ["javascript", "unknown"]);
+		A(splitChunks, "defaultSizeTypes", () =>
+			css ? ["javascript", "css", "unknown"] : ["javascript", "unknown"]
+		);
 		D(splitChunks, "hidePathInfo", production);
 		D(splitChunks, "chunks", "async");
 		D(splitChunks, "usedExports", optimization.usedExports === true);

package/lib/config/normalization.js

@@ -180,6 +180,9 @@ const getNormalizedWebpackOptions = config => {
 				experiments.lazyCompilation,
 				options =>
 					options === true ? {} : options === false ? undefined : options
+			),
+			css: optionalNestedConfig(experiments.css, options =>
+				options === true ? {} : options === false ? undefined : options
 			)
 		})),
 		externals: config.externals,
@@ -297,6 +300,8 @@ const getNormalizedWebpackOptions = config => {
 				chunkLoading: output.chunkLoading,
 				chunkLoadingGlobal: output.chunkLoadingGlobal,
 				chunkLoadTimeout: output.chunkLoadTimeout,
+				cssFilename: output.cssFilename,
+				cssChunkFilename: output.cssChunkFilename,
 				clean: output.clean,
 				compareBeforeEmit: output.compareBeforeEmit,
 				crossOriginLoading: output.crossOriginLoading,

package/lib/config/target.js

@@ -59,6 +59,8 @@ const getDefaultTarget = context => {
  * @property {boolean | null} dynamicImport async import() is available
  * @property {boolean | null} dynamicImportInWorker async import() is available when creating a worker
  * @property {boolean | null} module ESM syntax is available (when in module)
+ * @property {boolean | null} optionalChaining optional chaining is available
+ * @property {boolean | null} templateLiteral template literal is available
  */
 
 ///** @typedef {PlatformTargetProperties | ApiTargetProperties | EcmaTargetProperties | PlatformTargetProperties & ApiTargetProperties | PlatformTargetProperties & EcmaTargetProperties | ApiTargetProperties & EcmaTargetProperties} TargetProperties */
@@ -167,6 +169,8 @@ You can also more options via the 'target' option: 'browserslist' / 'browserslis
 
 				globalThis: v(12),
 				const: v(6),
+				templateLiteral: v(4),
+				optionalChaining: v(14),
 				arrowFunction: v(6),
 				forOf: v(5),
 				destructuring: v(6),
@@ -206,6 +210,8 @@ You can also more options via the 'target' option: 'browserslist' / 'browserslis
 
 				globalThis: v(5),
 				const: v(1, 1),
+				templateLiteral: v(1, 1),
+				optionalChaining: v(8),
 				arrowFunction: v(1, 1),
 				forOf: v(0, 36),
 				destructuring: v(1, 1),
@@ -241,6 +247,8 @@ You can also more options via the 'target' option: 'browserslist' / 'browserslis
 
 				globalThis: v(0, 43),
 				const: v(0, 15),
+				templateLiteral: v(0, 13),
+				optionalChaining: v(0, 44),
 				arrowFunction: v(0, 15),
 				forOf: v(0, 13),
 				destructuring: v(0, 15),
@@ -260,6 +268,8 @@ You can also more options via the 'target' option: 'browserslist' / 'browserslis
 			if (v < 1000) v = v + 2009;
 			return {
 				const: v >= 2015,
+				templateLiteral: v >= 2015,
+				optionalChaining: v >= 2020,
 				arrowFunction: v >= 2015,
 				forOf: v >= 2015,
 				destructuring: v >= 2015,

package/lib/container/ContainerEntryModule.js

@@ -10,6 +10,7 @@ const AsyncDependenciesBlock = require("../AsyncDependenciesBlock");
 const Module = require("../Module");
 const RuntimeGlobals = require("../RuntimeGlobals");
 const Template = require("../Template");
+const StaticExportsDependency = require("../dependencies/StaticExportsDependency");
 const makeSerializable = require("../util/makeSerializable");
 const ContainerExposedDependency = require("./ContainerExposedDependency");
 
@@ -78,12 +79,14 @@ class ContainerEntryModule extends Module {
 	 * @returns {string | null} an identifier for library inclusion
 	 */
 	libIdent(options) {
-		return `webpack/container/entry/${this._name}`;
+		return `${this.layer ? `(${this.layer})/` : ""}webpack/container/entry/${
+			this._name
+		}`;
 	}
 
 	/**
 	 * @param {NeedBuildContext} context context info
-	 * @param {function(WebpackError=, boolean=): void} callback callback function, returns true, if the module needs a rebuild
+	 * @param {function((WebpackError | null)=, boolean=): void} callback callback function, returns true, if the module needs a rebuild
 	 * @returns {void}
 	 */
 	needBuild(context, callback) {
@@ -104,6 +107,7 @@ class ContainerEntryModule extends Module {
 			strict: true,
 			topLevelDeclarations: new Set(["moduleMap", "get", "init"])
 		};
+		this.buildMeta.exportsType = "namespace";
 
 		this.clearDependenciesAndBlocks();
 
@@ -127,6 +131,7 @@ class ContainerEntryModule extends Module {
 			}
 			this.addBlock(block);
 		}
+		this.addDependency(new StaticExportsDependency(["get", "init"], false));
 
 		callback();
 	}
@@ -217,10 +222,8 @@ class ContainerEntryModule extends Module {
 			])};`,
 			`var init = ${runtimeTemplate.basicFunction("shareScope, initScope", [
 				`if (!${RuntimeGlobals.shareScopeMap}) return;`,
-				`var oldScope = ${RuntimeGlobals.shareScopeMap}[${JSON.stringify(
-					this._shareScope
-				)}];`,
 				`var name = ${JSON.stringify(this._shareScope)}`,
+				`var oldScope = ${RuntimeGlobals.shareScopeMap}[name];`,
 				`if(oldScope && oldScope !== shareScope) throw new Error("Container initialization failed as it has already been initialized with a different share scope");`,
 				`${RuntimeGlobals.shareScopeMap}[name] = shareScope;`,
 				`return ${RuntimeGlobals.initializeSharing}(name, initScope);`

package/lib/container/FallbackModule.js

@@ -60,9 +60,9 @@ class FallbackModule extends Module {
 	 * @returns {string | null} an identifier for library inclusion
 	 */
 	libIdent(options) {
-		return `webpack/container/fallback/${this.requests[0]}/and ${
-			this.requests.length - 1
-		} more`;
+		return `${this.layer ? `(${this.layer})/` : ""}webpack/container/fallback/${
+			this.requests[0]
+		}/and ${this.requests.length - 1} more`;
 	}
 
 	/**
@@ -76,7 +76,7 @@ class FallbackModule extends Module {
 
 	/**
 	 * @param {NeedBuildContext} context context info
-	 * @param {function(WebpackError=, boolean=): void} callback callback function, returns true, if the module needs a rebuild
+	 * @param {function((WebpackError | null)=, boolean=): void} callback callback function, returns true, if the module needs a rebuild
 	 * @returns {void}
 	 */
 	needBuild(context, callback) {

package/lib/container/RemoteModule.js

@@ -67,12 +67,14 @@ class RemoteModule extends Module {
 	 * @returns {string | null} an identifier for library inclusion
 	 */
 	libIdent(options) {
-		return `webpack/container/remote/${this.request}`;
+		return `${this.layer ? `(${this.layer})/` : ""}webpack/container/remote/${
+			this.request
+		}`;
 	}
 
 	/**
 	 * @param {NeedBuildContext} context context info
-	 * @param {function(WebpackError=, boolean=): void} callback callback function, returns true, if the module needs a rebuild
+	 * @param {function((WebpackError | null)=, boolean=): void} callback callback function, returns true, if the module needs a rebuild
 	 * @returns {void}
 	 */
 	needBuild(context, callback) {