webpack 5.101.2 → 5.102.0

package/lib/NormalModuleFactory.js

@@ -34,6 +34,8 @@ const {
 	parseResourceWithoutFragment
 } = require("./util/identifier");
 
+/** @typedef {import("enhanced-resolve").ResolveContext} ResolveContext */
+/** @typedef {import("enhanced-resolve").ResolveRequest} ResolveRequest */
 /** @typedef {import("../declarations/WebpackOptions").ModuleOptionsNormalized} ModuleOptions */
 /** @typedef {import("../declarations/WebpackOptions").RuleSetRule} RuleSetRule */
 /** @typedef {import("./Generator")} Generator */
@@ -47,8 +49,6 @@ const {
 /** @typedef {import("./NormalModule").ParserOptions} ParserOptions */
 /** @typedef {import("./Parser")} Parser */
 /** @typedef {import("./ResolverFactory")} ResolverFactory */
-/** @typedef {import("./ResolverFactory").ResolveContext} ResolveContext */
-/** @typedef {import("./ResolverFactory").ResolveRequest} ResolveRequest */
 /** @typedef {import("./ResolverFactory").ResolverWithOptions} ResolverWithOptions */
 /** @typedef {import("./dependencies/ModuleDependency")} ModuleDependency */
 /** @typedef {import("./javascript/JavascriptParser").ImportAttributes} ImportAttributes */
@@ -56,7 +56,12 @@ const {
 /** @typedef {import("./util/fs").InputFileSystem} InputFileSystem */
 /** @typedef {import("./util/identifier").AssociatedObjectForCache} AssociatedObjectForCache */
 
-/** @typedef {Pick<RuleSetRule, 'type' | 'sideEffects' | 'parser' | 'generator' | 'resolve' | 'layer'>} ModuleSettings */
+/**
+ * @template T
+ * @typedef {import("./Compiler").Callback<T>} Callback
+ */
+
+/** @typedef {Pick<RuleSetRule, 'type' | 'sideEffects' | 'parser' | 'generator' | 'resolve' | 'layer' | 'extractSourceMap'>} ModuleSettings */
 /** @typedef {Partial<NormalModuleCreateData & { settings: ModuleSettings }>} CreateData */
 
 /**
@@ -65,7 +70,7 @@ const {
  * @property {ModuleFactoryCreateData["resolveOptions"]} resolveOptions
  * @property {string} context
  * @property {string} request
- * @property {ImportAttributes | undefined} assertions
+ * @property {ImportAttributes | undefined} attributes
  * @property {ModuleDependency[]} dependencies
  * @property {string} dependencyType
  * @property {CreateData} createData
@@ -101,13 +106,23 @@ const {
  * @property {string|undefined} options options
  */
 
-/**
- * @template T
- * @callback Callback
- * @param {(Error | null)=} err
- * @param {T=} stats
- * @returns {void}
- */
+/** @typedef {import("./ModuleTypeConstants").JAVASCRIPT_MODULE_TYPE_AUTO} JAVASCRIPT_MODULE_TYPE_AUTO */
+/** @typedef {import("./ModuleTypeConstants").JAVASCRIPT_MODULE_TYPE_DYNAMIC} JAVASCRIPT_MODULE_TYPE_DYNAMIC */
+/** @typedef {import("./ModuleTypeConstants").JAVASCRIPT_MODULE_TYPE_ESM} JAVASCRIPT_MODULE_TYPE_ESM */
+/** @typedef {import("./ModuleTypeConstants").JSON_MODULE_TYPE} JSON_MODULE_TYPE */
+/** @typedef {import("./ModuleTypeConstants").ASSET_MODULE_TYPE} ASSET_MODULE_TYPE */
+/** @typedef {import("./ModuleTypeConstants").ASSET_MODULE_TYPE_INLINE} ASSET_MODULE_TYPE_INLINE */
+/** @typedef {import("./ModuleTypeConstants").ASSET_MODULE_TYPE_RESOURCE} ASSET_MODULE_TYPE_RESOURCE */
+/** @typedef {import("./ModuleTypeConstants").ASSET_MODULE_TYPE_SOURCE} ASSET_MODULE_TYPE_SOURCE */
+/** @typedef {import("./ModuleTypeConstants").WEBASSEMBLY_MODULE_TYPE_ASYNC} WEBASSEMBLY_MODULE_TYPE_ASYNC */
+/** @typedef {import("./ModuleTypeConstants").WEBASSEMBLY_MODULE_TYPE_SYNC} WEBASSEMBLY_MODULE_TYPE_SYNC */
+/** @typedef {import("./ModuleTypeConstants").CSS_MODULE_TYPE} CSS_MODULE_TYPE */
+/** @typedef {import("./ModuleTypeConstants").CSS_MODULE_TYPE_GLOBAL} CSS_MODULE_TYPE_GLOBAL */
+/** @typedef {import("./ModuleTypeConstants").CSS_MODULE_TYPE_MODULE} CSS_MODULE_TYPE_MODULE */
+/** @typedef {import("./ModuleTypeConstants").CSS_MODULE_TYPE_AUTO} CSS_MODULE_TYPE_AUTO */
+
+/** @typedef {JAVASCRIPT_MODULE_TYPE_AUTO | JAVASCRIPT_MODULE_TYPE_DYNAMIC | JAVASCRIPT_MODULE_TYPE_ESM | JSON_MODULE_TYPE | ASSET_MODULE_TYPE | ASSET_MODULE_TYPE_INLINE | ASSET_MODULE_TYPE_RESOURCE | ASSET_MODULE_TYPE_SOURCE | WEBASSEMBLY_MODULE_TYPE_ASYNC | WEBASSEMBLY_MODULE_TYPE_SYNC | CSS_MODULE_TYPE | CSS_MODULE_TYPE_GLOBAL | CSS_MODULE_TYPE_MODULE | CSS_MODULE_TYPE_AUTO} KnownNormalModuleTypes */
+/** @typedef {KnownNormalModuleTypes | string} NormalModuleTypes */
 
 const EMPTY_RESOLVE_OPTIONS = {};
 /** @type {ParserOptions} */
@@ -227,7 +242,7 @@ const ruleSetCompiler = new RuleSetCompiler([
 	new BasicMatcherRulePlugin("issuer"),
 	new BasicMatcherRulePlugin("compiler"),
 	new BasicMatcherRulePlugin("issuerLayer"),
-	new ObjectMatcherRulePlugin("assert", "assertions", (value) => {
+	new ObjectMatcherRulePlugin("assert", "attributes", (value) => {
 		if (value) {
 			return (
 				/** @type {ImportAttributes} */ (value)._isLegacyAssert !== undefined
@@ -236,7 +251,7 @@ const ruleSetCompiler = new RuleSetCompiler([
 
 		return false;
 	}),
-	new ObjectMatcherRulePlugin("with", "assertions", (value) => {
+	new ObjectMatcherRulePlugin("with", "attributes", (value) => {
 		if (value) {
 			return !(/** @type {ImportAttributes} */ (value)._isLegacyAssert);
 		}
@@ -249,6 +264,7 @@ const ruleSetCompiler = new RuleSetCompiler([
 	new BasicEffectRulePlugin("resolve"),
 	new BasicEffectRulePlugin("generator"),
 	new BasicEffectRulePlugin("layer"),
+	new BasicEffectRulePlugin("extractSourceMap"),
 	new UseEffectRulePlugin()
 ]);
 
@@ -260,15 +276,13 @@ class NormalModuleFactory extends ModuleFactory {
 	 * @param {ResolverFactory} param.resolverFactory resolverFactory
 	 * @param {ModuleOptions} param.options options
 	 * @param {AssociatedObjectForCache} param.associatedObjectForCache an object to which the cache will be attached
-	 * @param {boolean=} param.layers enable layers
 	 */
 	constructor({
 		context,
 		fs,
 		resolverFactory,
 		options,
-		associatedObjectForCache,
-		layers = false
+		associatedObjectForCache
 	}) {
 		super();
 		this.hooks = Object.freeze({
@@ -294,13 +308,13 @@ class NormalModuleFactory extends ModuleFactory {
 			module: new SyncWaterfallHook(["module", "createData", "resolveData"]),
 			/** @type {HookMap<SyncBailHook<[ParserOptions], Parser | void>>} */
 			createParser: new HookMap(() => new SyncBailHook(["parserOptions"])),
-			/** @type {HookMap<SyncBailHook<[TODO, ParserOptions], void>>} */
+			/** @type {HookMap<SyncBailHook<[EXPECTED_ANY, ParserOptions], void>>} */
 			parser: new HookMap(() => new SyncHook(["parser", "parserOptions"])),
 			/** @type {HookMap<SyncBailHook<[GeneratorOptions], Generator | void>>} */
 			createGenerator: new HookMap(
 				() => new SyncBailHook(["generatorOptions"])
 			),
-			/** @type {HookMap<SyncBailHook<[TODO, GeneratorOptions], void>>} */
+			/** @type {HookMap<SyncBailHook<[EXPECTED_ANY, GeneratorOptions], void>>} */
 			generator: new HookMap(
 				() => new SyncHook(["generator", "generatorOptions"])
 			),
@@ -430,7 +444,7 @@ class NormalModuleFactory extends ModuleFactory {
 					dependencies,
 					dependencyType,
 					request,
-					assertions,
+					attributes,
 					resolveOptions,
 					fileDependencies,
 					missingDependencies,
@@ -601,7 +615,7 @@ class NormalModuleFactory extends ModuleFactory {
 							resourceQuery: resourceDataForRules.query,
 							resourceFragment: resourceDataForRules.fragment,
 							scheme,
-							assertions,
+							attributes,
 							mimetype: matchResourceData
 								? ""
 								: resourceData.data.mimetype || "",
@@ -683,16 +697,10 @@ class NormalModuleFactory extends ModuleFactory {
 						for (const loader of /** @type {LoaderItem[]} */ (preLoaders)) {
 							allLoaders.push(loader);
 						}
-						const type = /** @type {string} */ (settings.type);
+						const type = /** @type {NormalModuleTypes} */ (settings.type);
 						const resolveOptions = settings.resolve;
 						const layer = settings.layer;
-						if (layer !== undefined && !layers) {
-							return callback(
-								new Error(
-									"'Rule.layer' is only allowed when 'experiments.layers' is enabled"
-								)
-							);
-						}
+
 						try {
 							Object.assign(data.createData, {
 								layer:
@@ -717,7 +725,8 @@ class NormalModuleFactory extends ModuleFactory {
 								parserOptions: settings.parser,
 								generator: this.getGenerator(type, settings.generator),
 								generatorOptions: settings.generator,
-								resolveOptions
+								resolveOptions,
+								extractSourceMap: settings.extractSourceMap || false
 							});
 						} catch (createDataErr) {
 							return callback(/** @type {Error} */ (createDataErr));
@@ -887,7 +896,9 @@ class NormalModuleFactory extends ModuleFactory {
 		const resolveOptions = data.resolveOptions || EMPTY_RESOLVE_OPTIONS;
 		const dependency = dependencies[0];
 		const request = dependency.request;
-		const assertions = dependency.assertions;
+		const attributes =
+			/** @type {ModuleDependency & { attributes: ImportAttributes }} */
+			(dependency).attributes;
 		const dependencyType = dependency.category || "";
 		const contextInfo = data.contextInfo;
 		const fileDependencies = new LazySet();
@@ -899,7 +910,7 @@ class NormalModuleFactory extends ModuleFactory {
 			resolveOptions,
 			context,
 			request,
-			assertions,
+			attributes,
 			dependencies,
 			dependencyType,
 			fileDependencies,
@@ -1186,6 +1197,10 @@ If changing the source code is not an option there is also a resolve options cal
 		if (array.length === 0) return callback(null, array);
 		asyncLib.map(
 			array,
+			/**
+			 * @param {LoaderItem} item item
+			 * @param {Callback<LoaderItem>} callback callback
+			 */
 			(item, callback) => {
 				resolver.resolve(
 					contextInfo,
@@ -1218,7 +1233,8 @@ If changing the source code is not an option there is also a resolve options cal
 						if (err) return callback(err);
 
 						const parsedResult = this._parseResourceWithoutFragment(
-							/** @type {string} */ (result)
+							/** @type {string} */
+							(result)
 						);
 
 						const type = /\.mjs$/i.test(parsedResult.path)
@@ -1228,8 +1244,12 @@ If changing the source code is not an option there is also a resolve options cal
 								: /** @type {ResolveRequest} */
 									(resolveRequest).descriptionFileData === undefined
 									? undefined
-									: /** @type {ResolveRequest} */
-										(resolveRequest).descriptionFileData.type;
+									: /** @type {string} */
+										(
+											/** @type {ResolveRequest} */
+											(resolveRequest).descriptionFileData.type
+										);
+						/** @type {LoaderItem} */
 						const resolved = {
 							loader: parsedResult.path,
 							type,
@@ -1239,17 +1259,16 @@ If changing the source code is not an option there is also a resolve options cal
 										? parsedResult.query.slice(1)
 										: undefined
 									: item.options,
-							ident:
-								item.options === undefined
-									? undefined
-									: /** @type {string} */ (item.ident)
+							ident: item.options === undefined ? undefined : item.ident
 						};
 
-						return callback(null, /** @type {LoaderItem} */ (resolved));
+						return callback(null, resolved);
 					}
 				);
 			},
-			/** @type {Callback<(LoaderItem | undefined)[]>} */ (callback)
+			(err, value) => {
+				callback(err, /** @type {(LoaderItem)[]} */ (value));
+			}
 		);
 	}
 

package/lib/OptionsApply.js

@@ -5,7 +5,7 @@
 
 "use strict";
 
-/** @typedef {import("../declarations/WebpackOptions").WebpackOptionsNormalized} WebpackOptions */
+/** @typedef {import("./config/defaults").WebpackOptionsNormalizedWithDefaults} WebpackOptions */
 /** @typedef {import("./Compiler")} Compiler */
 
 class OptionsApply {

package/lib/Parser.js

@@ -5,7 +5,7 @@
 
 "use strict";
 
-/** @typedef {import("../declarations/WebpackOptions").WebpackOptionsNormalized} WebpackOptions */
+/** @typedef {import("./config/defaults").WebpackOptionsNormalizedWithDefaults} WebpackOptions */
 /** @typedef {import("./Compilation")} Compilation */
 /** @typedef {import("./NormalModule")} NormalModule */
 

package/lib/ProgressPlugin.js

@@ -16,9 +16,7 @@ const { contextify } = require("./util/identifier");
  * @template T, R, AdditionalOptions
  * @typedef {import("tapable").Hook<T, R, AdditionalOptions>} Hook
  */
-/** @typedef {import("../declarations/plugins/ProgressPlugin").HandlerFunction} HandlerFunction */
 /** @typedef {import("../declarations/plugins/ProgressPlugin").ProgressPluginArgument} ProgressPluginArgument */
-/** @typedef {import("../declarations/plugins/ProgressPlugin").ProgressPluginOptions} ProgressPluginOptions */
 /** @typedef {import("./Compilation").FactorizeModuleOptions} FactorizeModuleOptions */
 /** @typedef {import("./Dependency")} Dependency */
 /** @typedef {import("./Entrypoint").EntryOptions} EntryOptions */
@@ -54,20 +52,18 @@ const validate = createSchemaValidation(
  */
 const median3 = (a, b, c) => a + b + c - Math.max(a, b, c) - Math.min(a, b, c);
 
+/** @typedef {(percentage: number, msg: string, ...args: string[]) => void} HandlerFn */
+
 /**
  * @param {boolean | null | undefined} profile need profile
  * @param {Logger} logger logger
- * @returns {defaultHandler} default handler
+ * @returns {HandlerFn} default handler
  */
 const createDefaultHandler = (profile, logger) => {
 	/** @type {{ value: string | undefined, time: number }[]} */
 	const lastStateInfo = [];
 
-	/**
-	 * @param {number} percentage percentage
-	 * @param {string} msg message
-	 * @param {...string} args additional arguments
-	 */
+	/** @type {HandlerFn} */
 	const defaultHandler = (percentage, msg, ...args) => {
 		if (profile) {
 			if (percentage === 0) {
@@ -199,7 +195,7 @@ class ProgressPlugin {
 
 	/**
 	 * @param {MultiCompiler} compiler webpack multi-compiler
-	 * @param {HandlerFunction} handler function that executes for every progress step
+	 * @param {HandlerFn} handler function that executes for every progress step
 	 * @returns {void}
 	 */
 	_applyOnMultiCompiler(compiler, handler) {
@@ -218,7 +214,7 @@ class ProgressPlugin {
 
 	/**
 	 * @param {Compiler} compiler webpack compiler
-	 * @param {HandlerFunction} handler function that executes for every progress step
+	 * @param {HandlerFn} handler function that executes for every progress step
 	 * @returns {void}
 	 */
 	_applyOnCompiler(compiler, handler) {

package/lib/ProvidePlugin.js

@@ -59,13 +59,11 @@ class ProvidePlugin {
 				 */
 				const handler = (parser, parserOptions) => {
 					for (const name of Object.keys(definitions)) {
-						const request =
-							/** @type {string[]} */
-							([
-								...(Array.isArray(definitions[name])
-									? definitions[name]
-									: [definitions[name]])
-							]);
+						const request = [
+							...(Array.isArray(definitions[name])
+								? definitions[name]
+								: [definitions[name]])
+						];
 						const splittedName = name.split(".");
 						if (splittedName.length > 0) {
 							for (const [i, _] of splittedName.slice(1).entries()) {

package/lib/RawModule.js

@@ -11,12 +11,9 @@ const { JS_TYPES } = require("./ModuleSourceTypesConstants");
 const { JAVASCRIPT_MODULE_TYPE_DYNAMIC } = require("./ModuleTypeConstants");
 const makeSerializable = require("./util/makeSerializable");
 
-/** @typedef {import("webpack-sources").Source} Source */
-/** @typedef {import("../declarations/WebpackOptions").WebpackOptionsNormalized} WebpackOptions */
-/** @typedef {import("./ChunkGraph")} ChunkGraph */
+/** @typedef {import("./config/defaults").WebpackOptionsNormalizedWithDefaults} WebpackOptions */
 /** @typedef {import("./Compilation")} Compilation */
 /** @typedef {import("./Dependency").UpdateHashContext} UpdateHashContext */
-/** @typedef {import("./DependencyTemplates")} DependencyTemplates */
 /** @typedef {import("./Generator").SourceTypes} SourceTypes */
 /** @typedef {import("./Module").BuildCallback} BuildCallback */
 /** @typedef {import("./Module").CodeGenerationContext} CodeGenerationContext */
@@ -28,8 +25,6 @@ const makeSerializable = require("./util/makeSerializable");
 /** @typedef {import("./ModuleGraphConnection").ConnectionState} ConnectionState */
 /** @typedef {import("./RequestShortener")} RequestShortener */
 /** @typedef {import("./ResolverFactory").ResolverWithOptions} ResolverWithOptions */
-/** @typedef {import("./RuntimeTemplate")} RuntimeTemplate */
-/** @typedef {import("./WebpackError")} WebpackError */
 /** @typedef {import("./serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
 /** @typedef {import("./serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
 /** @typedef {import("./util/Hash")} Hash */

package/lib/RecordIdsPlugin.js

@@ -36,6 +36,8 @@ const identifierUtils = require("./util/identifier");
  * @property {boolean=} portableIds true, when ids need to be portable
  */
 
+/** @typedef {Set<number>} UsedIds */
+
 const PLUGIN_NAME = "RecordIdsPlugin";
 
 class RecordIdsPlugin {
@@ -75,7 +77,7 @@ class RecordIdsPlugin {
 				const chunkGraph = compilation.chunkGraph;
 				if (!records.modules) records.modules = {};
 				if (!records.modules.byIdentifier) records.modules.byIdentifier = {};
-				/** @type {Set<number>} */
+				/** @type {UsedIds} */
 				const usedIds = new Set();
 				for (const module of modules) {
 					const moduleId = chunkGraph.getModuleId(module);
@@ -90,7 +92,7 @@ class RecordIdsPlugin {
 				if (!records.modules) return;
 				if (records.modules.byIdentifier) {
 					const chunkGraph = compilation.chunkGraph;
-					/** @type {Set<number>} */
+					/** @type {UsedIds} */
 					const usedIds = new Set();
 					for (const module of modules) {
 						const moduleId = chunkGraph.getModuleId(module);
@@ -108,12 +110,14 @@ class RecordIdsPlugin {
 				}
 			});
 
+			/** @typedef {string[]} ChunkSources */
+
 			/**
 			 * @param {Chunk} chunk the chunk
-			 * @returns {string[]} sources of the chunk
+			 * @returns {ChunkSources} sources of the chunk
 			 */
 			const getChunkSources = (chunk) => {
-				/** @type {string[]} */
+				/** @type {ChunkSources} */
 				const sources = [];
 				for (const chunkGroup of chunk.groupsIterable) {
 					const index = chunkGroup.chunks.indexOf(chunk);
@@ -156,7 +160,7 @@ class RecordIdsPlugin {
 				if (!records.chunks) records.chunks = {};
 				if (!records.chunks.byName) records.chunks.byName = {};
 				if (!records.chunks.bySource) records.chunks.bySource = {};
-				/** @type {Set<number>} */
+				/** @type {UsedIds} */
 				const usedIds = new Set();
 				for (const chunk of chunks) {
 					if (typeof chunk.id !== "number") continue;
@@ -172,7 +176,7 @@ class RecordIdsPlugin {
 			});
 			compilation.hooks.reviveChunks.tap(PLUGIN_NAME, (chunks, records) => {
 				if (!records.chunks) return;
-				/** @type {Set<number>} */
+				/** @type {UsedIds} */
 				const usedIds = new Set();
 				if (records.chunks.byName) {
 					for (const chunk of chunks) {

package/lib/ResolverFactory.js

@@ -13,9 +13,7 @@ const {
 	resolveByProperty
 } = require("./util/cleverMerge");
 
-/** @typedef {import("enhanced-resolve").ResolveContext} ResolveContext */
 /** @typedef {import("enhanced-resolve").ResolveOptions} ResolveOptions */
-/** @typedef {import("enhanced-resolve").ResolveRequest} ResolveRequest */
 /** @typedef {import("enhanced-resolve").Resolver} Resolver */
 /** @typedef {import("../declarations/WebpackOptions").ResolveOptions} WebpackResolveOptions */
 /** @typedef {import("../declarations/WebpackOptions").ResolvePluginInstance} ResolvePluginInstance */

package/lib/RuntimeGlobals.js

@@ -416,6 +416,11 @@ module.exports.systemContext = "__webpack_require__.y";
  */
 module.exports.thisAsExports = "top-level-this-exports";
 
+/**
+ * to binary helper, convert base64 to Uint8Array
+ */
+module.exports.toBinary = "__webpack_require__.tb";
+
 /**
  * the uncaught error handler for the webpack runtime
  */

package/lib/RuntimeModule.js

@@ -11,8 +11,7 @@ const Module = require("./Module");
 const { RUNTIME_TYPES } = require("./ModuleSourceTypesConstants");
 const { WEBPACK_MODULE_TYPE_RUNTIME } = require("./ModuleTypeConstants");
 
-/** @typedef {import("webpack-sources").Source} Source */
-/** @typedef {import("../declarations/WebpackOptions").WebpackOptionsNormalized} WebpackOptions */
+/** @typedef {import("./config/defaults").WebpackOptionsNormalizedWithDefaults} WebpackOptions */
 /** @typedef {import("./Chunk")} Chunk */
 /** @typedef {import("./ChunkGraph")} ChunkGraph */
 /** @typedef {import("./Compilation")} Compilation */
@@ -25,7 +24,6 @@ const { WEBPACK_MODULE_TYPE_RUNTIME } = require("./ModuleTypeConstants");
 /** @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 */
 

package/lib/RuntimePlugin.js

@@ -6,7 +6,6 @@
 "use strict";
 
 const RuntimeGlobals = require("./RuntimeGlobals");
-const { getChunkFilenameTemplate } = require("./css/CssModulesPlugin");
 const RuntimeRequirementsDependency = require("./dependencies/RuntimeRequirementsDependency");
 const JavascriptModulesPlugin = require("./javascript/JavascriptModulesPlugin");
 const AsyncModuleRuntimeModule = require("./runtime/AsyncModuleRuntimeModule");
@@ -33,16 +32,14 @@ const PublicPathRuntimeModule = require("./runtime/PublicPathRuntimeModule");
 const RelativeUrlRuntimeModule = require("./runtime/RelativeUrlRuntimeModule");
 const RuntimeIdRuntimeModule = require("./runtime/RuntimeIdRuntimeModule");
 const SystemContextRuntimeModule = require("./runtime/SystemContextRuntimeModule");
+const ToBinaryRuntimeModule = require("./runtime/ToBinaryRuntimeModule");
 const ShareRuntimeModule = require("./sharing/ShareRuntimeModule");
 const StringXor = require("./util/StringXor");
 const memoize = require("./util/memoize");
 
 /** @typedef {import("../declarations/WebpackOptions").LibraryOptions} LibraryOptions */
-/** @typedef {import("../declarations/WebpackOptions").OutputNormalized} OutputNormalized */
 /** @typedef {import("./Chunk")} Chunk */
 /** @typedef {import("./Compiler")} Compiler */
-/** @typedef {import("./Module")} Module */
-/** @typedef {import("./TemplatedPathPlugin").TemplatePath} TemplatePath */
 
 const getJavascriptModulesPlugin = memoize(() =>
 	require("./javascript/JavascriptModulesPlugin")
@@ -310,12 +307,10 @@ class RuntimePlugin {
 							RuntimeGlobals.getChunkScriptFilename,
 							(chunk) =>
 								getJavascriptModulesPlugin().chunkHasJs(chunk, chunkGraph) &&
-								/** @type {TemplatePath} */ (
-									chunk.filenameTemplate ||
-										(chunk.canBeInitial()
-											? compilation.outputOptions.filename
-											: compilation.outputOptions.chunkFilename)
-								),
+								(chunk.filenameTemplate ||
+									(chunk.canBeInitial()
+										? compilation.outputOptions.filename
+										: compilation.outputOptions.chunkFilename)),
 							set.has(RuntimeGlobals.hmrDownloadUpdateHandlers)
 						)
 					);
@@ -338,9 +333,17 @@ class RuntimePlugin {
 							"css",
 							"css",
 							RuntimeGlobals.getChunkCssFilename,
-							(chunk) =>
-								getCssModulesPlugin().chunkHasCss(chunk, chunkGraph) &&
-								getChunkFilenameTemplate(chunk, compilation.outputOptions),
+							(chunk) => {
+								const cssModulePlugin = getCssModulesPlugin();
+
+								return (
+									cssModulePlugin.chunkHasCss(chunk, chunkGraph) &&
+									cssModulePlugin.getChunkFilenameTemplate(
+										chunk,
+										compilation.outputOptions
+									)
+								);
+							},
 							set.has(RuntimeGlobals.hmrDownloadUpdateHandlers)
 						)
 					);
@@ -351,8 +354,7 @@ class RuntimePlugin {
 				.tap(PLUGIN_NAME, (chunk, set) => {
 					if (
 						/\[(full)?hash(:\d+)?\]/.test(
-							/** @type {NonNullable<OutputNormalized["hotUpdateChunkFilename"]>} */
-							(compilation.outputOptions.hotUpdateChunkFilename)
+							compilation.outputOptions.hotUpdateChunkFilename
 						)
 					) {
 						set.add(RuntimeGlobals.getFullHash);
@@ -363,9 +365,7 @@ class RuntimePlugin {
 							"javascript",
 							"javascript update",
 							RuntimeGlobals.getChunkUpdateScriptFilename,
-							(_chunk) =>
-								/** @type {NonNullable<OutputNormalized["hotUpdateChunkFilename"]>} */
-								(compilation.outputOptions.hotUpdateChunkFilename),
+							(_chunk) => compilation.outputOptions.hotUpdateChunkFilename,
 							true
 						)
 					);
@@ -376,8 +376,7 @@ class RuntimePlugin {
 				.tap(PLUGIN_NAME, (chunk, set) => {
 					if (
 						/\[(full)?hash(:\d+)?\]/.test(
-							/** @type {NonNullable<OutputNormalized["hotUpdateMainFilename"]>} */
-							(compilation.outputOptions.hotUpdateMainFilename)
+							compilation.outputOptions.hotUpdateMainFilename
 						)
 					) {
 						set.add(RuntimeGlobals.getFullHash);
@@ -387,8 +386,7 @@ class RuntimePlugin {
 						new GetMainFilenameRuntimeModule(
 							"update manifest",
 							RuntimeGlobals.getUpdateManifestFilename,
-							/** @type {NonNullable<OutputNormalized["hotUpdateMainFilename"]>} */
-							(compilation.outputOptions.hotUpdateMainFilename)
+							compilation.outputOptions.hotUpdateMainFilename
 						)
 					);
 					return true;
@@ -492,6 +490,12 @@ class RuntimePlugin {
 					compilation.addRuntimeModule(chunk, new NonceRuntimeModule());
 					return true;
 				});
+			compilation.hooks.runtimeRequirementInTree
+				.for(RuntimeGlobals.toBinary)
+				.tap(PLUGIN_NAME, (chunk) => {
+					compilation.addRuntimeModule(chunk, new ToBinaryRuntimeModule());
+					return true;
+				});
 			// TODO webpack 6: remove CompatRuntimeModule
 			compilation.hooks.additionalTreeRuntimeRequirements.tap(
 				PLUGIN_NAME,

package/lib/RuntimeTemplate.js

@@ -20,13 +20,10 @@ const compileBooleanMatcher = require("./util/compileBooleanMatcher");
 const propertyAccess = require("./util/propertyAccess");
 const { forEachRuntime, subtractRuntime } = require("./util/runtime");
 
-/** @typedef {import("../declarations/WebpackOptions").Environment} Environment */
-/** @typedef {import("../declarations/WebpackOptions").OutputNormalized} OutputOptions */
+/** @typedef {import("./config/defaults").OutputNormalizedWithDefaults} OutputOptions */
 /** @typedef {import("./AsyncDependenciesBlock")} AsyncDependenciesBlock */
 /** @typedef {import("./Chunk")} Chunk */
 /** @typedef {import("./ChunkGraph")} ChunkGraph */
-/** @typedef {import("./CodeGenerationResults")} CodeGenerationResults */
-/** @typedef {import("./CodeGenerationResults").CodeGenerationResult} CodeGenerationResult */
 /** @typedef {import("./Compilation")} Compilation */
 /** @typedef {import("./Dependency")} Dependency */
 /** @typedef {import("./Module")} Module */
@@ -97,10 +94,7 @@ class RuntimeTemplate {
 		this.globalObject =
 			/** @type {string} */
 			(getGlobalObject(outputOptions.globalObject));
-		this.contentHashReplacement = "X".repeat(
-			/** @type {NonNullable<OutputOptions["hashDigestLength"]>} */
-			(outputOptions.hashDigestLength)
-		);
+		this.contentHashReplacement = "X".repeat(outputOptions.hashDigestLength);
 	}
 
 	isIIFE() {
@@ -113,7 +107,7 @@ class RuntimeTemplate {
 
 	isNeutralPlatform() {
 		return (
-			!this.outputOptions.environment.document &&
+			!this.compilation.compiler.platform.web &&
 			!this.compilation.compiler.platform.node
 		);
 	}
@@ -172,6 +166,13 @@ class RuntimeTemplate {
 			: `"${mod}"`;
 	}
 
+	/**
+	 * @returns {"const" | "var"} return `const` when it is supported, otherwise `var`
+	 */
+	renderConst() {
+		return this.supportsConst() ? "const" : "var";
+	}
+
 	/**
 	 * @param {string} returnValue return value
 	 * @param {string} args arguments
@@ -195,7 +196,7 @@ class RuntimeTemplate {
 	}
 
 	/**
-	 * @param {Array<string|{expr: string}>} args args
+	 * @param {(string | { expr: string })[]} args args
 	 * @returns {string} result expression
 	 */
 	concatenation(...args) {
@@ -244,7 +245,7 @@ class RuntimeTemplate {
 	}
 
 	/**
-	 * @param {Array<string|{expr: string}>} args args (len >= 2)
+	 * @param {(string | { expr: string })[]} args args (len >= 2)
 	 * @returns {string} result expression
 	 * @private
 	 */