webpack 5.42.1 → 5.45.1

package/lib/Compilation.js

@@ -855,10 +855,13 @@ BREAKING CHANGE: Asset processing hooks in Compilation has been merged into a si
 			logger: this.getLogger("webpack.FileSystemInfo")
 		});
 		if (compiler.fileTimestamps) {
-			this.fileSystemInfo.addFileTimestamps(compiler.fileTimestamps);
+			this.fileSystemInfo.addFileTimestamps(compiler.fileTimestamps, true);
 		}
 		if (compiler.contextTimestamps) {
-			this.fileSystemInfo.addContextTimestamps(compiler.contextTimestamps);
+			this.fileSystemInfo.addContextTimestamps(
+				compiler.contextTimestamps,
+				true
+			);
 		}
 		/** @type {Map<string, string | Set<string>>} */
 		this.valueCacheVersions = new Map();

package/lib/Compiler.js

@@ -222,13 +222,13 @@ class Compiler {
 		/** @type {Set<string>} */
 		this.immutablePaths = new Set();
 
-		/** @type {Set<string>} */
+		/** @type {ReadonlySet<string>} */
 		this.modifiedFiles = undefined;
-		/** @type {Set<string>} */
+		/** @type {ReadonlySet<string>} */
 		this.removedFiles = undefined;
-		/** @type {Map<string, FileSystemInfoEntry | "ignore" | null>} */
+		/** @type {ReadonlyMap<string, FileSystemInfoEntry | "ignore" | null>} */
 		this.fileTimestamps = undefined;
-		/** @type {Map<string, FileSystemInfoEntry | "ignore" | null>} */
+		/** @type {ReadonlyMap<string, FileSystemInfoEntry | "ignore" | null>} */
 		this.contextTimestamps = undefined;
 		/** @type {number} */
 		this.fsStartTime = undefined;

package/lib/ExternalModule.js

@@ -16,6 +16,7 @@ const StaticExportsDependency = require("./dependencies/StaticExportsDependency"
 const extractUrlAndGlobal = require("./util/extractUrlAndGlobal");
 const makeSerializable = require("./util/makeSerializable");
 const propertyAccess = require("./util/propertyAccess");
+const { register } = require("./util/serialization");
 
 /** @typedef {import("webpack-sources").Source} Source */
 /** @typedef {import("../declarations/WebpackOptions").WebpackOptionsNormalized} WebpackOptions */
@@ -169,6 +170,8 @@ class ModuleExternalInitFragment extends InitFragment {
 			`external module import ${id}`
 		);
 		this._identifier = identifier;
+		this._id = id;
+		this._request = request;
 	}
 
 	getNamespaceIdentifier() {
@@ -176,6 +179,21 @@ class ModuleExternalInitFragment extends InitFragment {
 	}
 }
 
+register(
+	ModuleExternalInitFragment,
+	"webpack/lib/ExternalModule",
+	"ModuleExternalInitFragment",
+	{
+		serialize(obj, { write }) {
+			write(obj._id);
+			write(obj._request);
+		},
+		deserialize({ read }) {
+			return new ModuleExternalInitFragment(read(), read());
+		}
+	}
+);
+
 const generateModuleRemapping = (input, exportsInfo, runtime) => {
 	if (exportsInfo.otherExportsInfo.getUsed(runtime) === UsageState.Unused) {
 		const properties = [];

package/lib/ExternalModuleFactoryPlugin.js

@@ -12,7 +12,7 @@ const { resolveByProperty, cachedSetProperty } = require("./util/cleverMerge");
 /** @typedef {import("../declarations/WebpackOptions").Externals} Externals */
 /** @typedef {import("./NormalModuleFactory")} NormalModuleFactory */
 
-const UNSPECIFIED_EXTERNAL_TYPE_REGEXP = /^[a-z0-9]+ /;
+const UNSPECIFIED_EXTERNAL_TYPE_REGEXP = /^[a-z0-9-]+ /;
 const EMPTY_RESOLVE_OPTIONS = {};
 
 // TODO webpack 6 remove this

package/lib/FileSystemInfo.js

@@ -8,6 +8,7 @@
 const { create: createResolver } = require("enhanced-resolve");
 const asyncLib = require("neo-async");
 const AsyncQueue = require("./util/AsyncQueue");
+const StackedCacheMap = require("./util/StackedCacheMap");
 const createHash = require("./util/createHash");
 const { join, dirname, relative } = require("./util/fs");
 const makeSerializable = require("./util/makeSerializable");
@@ -365,7 +366,7 @@ class Snapshot {
 	}
 
 	/**
-	 * @param {function(Snapshot): (Map<string, any> | Set<string>)[]} getMaps first
+	 * @param {function(Snapshot): (ReadonlyMap<string, any> | ReadonlySet<string>)[]} getMaps first
 	 * @returns {Iterable<string>} iterable
 	 */
 	_createIterable(getMaps) {
@@ -853,14 +854,14 @@ class FileSystemInfo {
 			(s, v) => s.setManagedMissing(v),
 			true
 		);
-		/** @type {Map<string, FileSystemInfoEntry | "ignore" | null>} */
-		this._fileTimestamps = new Map();
+		/** @type {StackedCacheMap<string, FileSystemInfoEntry | "ignore" | null>} */
+		this._fileTimestamps = new StackedCacheMap();
 		/** @type {Map<string, string>} */
 		this._fileHashes = new Map();
 		/** @type {Map<string, TimestampAndHash | string>} */
 		this._fileTshs = new Map();
-		/** @type {Map<string, FileSystemInfoEntry | "ignore" | null>} */
-		this._contextTimestamps = new Map();
+		/** @type {StackedCacheMap<string, FileSystemInfoEntry | "ignore" | null>} */
+		this._contextTimestamps = new StackedCacheMap();
 		/** @type {Map<string, string>} */
 		this._contextHashes = new Map();
 		/** @type {Map<string, TimestampAndHash | string>} */
@@ -1060,24 +1061,22 @@ class FileSystemInfo {
 	}
 
 	/**
-	 * @param {Map<string, FileSystemInfoEntry | "ignore" | null>} map timestamps
+	 * @param {ReadonlyMap<string, FileSystemInfoEntry | "ignore" | null>} map timestamps
+	 * @param {boolean=} immutable if 'map' is immutable and FileSystemInfo can keep referencing it
 	 * @returns {void}
 	 */
-	addFileTimestamps(map) {
-		for (const [path, ts] of map) {
-			this._fileTimestamps.set(path, ts);
-		}
+	addFileTimestamps(map, immutable) {
+		this._fileTimestamps.addAll(map, immutable);
 		this._cachedDeprecatedFileTimestamps = undefined;
 	}
 
 	/**
-	 * @param {Map<string, FileSystemInfoEntry | "ignore" | null>} map timestamps
+	 * @param {ReadonlyMap<string, FileSystemInfoEntry | "ignore" | null>} map timestamps
+	 * @param {boolean=} immutable if 'map' is immutable and FileSystemInfo can keep referencing it
 	 * @returns {void}
 	 */
-	addContextTimestamps(map) {
-		for (const [path, ts] of map) {
-			this._contextTimestamps.set(path, ts);
-		}
+	addContextTimestamps(map, immutable) {
+		this._contextTimestamps.addAll(map, immutable);
 		this._cachedDeprecatedContextTimestamps = undefined;
 	}
 

package/lib/FlagDependencyUsagePlugin.js

@@ -180,7 +180,11 @@ class FlagDependencyUsagePlugin {
 									b.groupOptions &&
 									b.groupOptions.entryOptions
 								) {
-									processModule(b, b.groupOptions.entryOptions.runtime, true);
+									processModule(
+										b,
+										b.groupOptions.entryOptions.runtime || undefined,
+										true
+									);
 								} else {
 									queue.enqueue(b);
 								}

package/lib/MultiCompiler.js

@@ -313,12 +313,12 @@ module.exports = class MultiCompiler {
 	/**
 	 * @template SetupResult
 	 * @param {function(Compiler, number, Callback<Stats>, function(): boolean, function(): void, function(): void): SetupResult} setup setup a single compiler
-	 * @param {function(Compiler, Callback<Stats>): void} run run/continue a single compiler
+	 * @param {function(Compiler, SetupResult, Callback<Stats>): void} run run/continue a single compiler
 	 * @param {Callback<MultiStats>} callback callback when all compilers are done, result includes Stats of all changed compilers
 	 * @returns {SetupResult[]} result of setup
 	 */
 	_runGraph(setup, run, callback) {
-		/** @typedef {{ compiler: Compiler, result: Stats, state: "pending" | "blocked" | "queued" | "starting" | "running" | "running-outdated" | "done", children: Node[], parents: Node[] }} Node */
+		/** @typedef {{ compiler: Compiler, setupResult: SetupResult, result: Stats, state: "pending" | "blocked" | "queued" | "starting" | "running" | "running-outdated" | "done", children: Node[], parents: Node[] }} Node */
 
 		// State transitions for nodes:
 		// -> blocked (initial)
@@ -335,6 +335,7 @@ module.exports = class MultiCompiler {
 		/** @type {Node[]} */
 		const nodes = this.compilers.map(compiler => ({
 			compiler,
+			setupResult: undefined,
 			result: undefined,
 			state: "blocked",
 			children: [],
@@ -444,14 +445,14 @@ module.exports = class MultiCompiler {
 		const setupResults = [];
 		nodes.forEach((node, i) => {
 			setupResults.push(
-				setup(
+				(node.setupResult = setup(
 					node.compiler,
 					i,
 					nodeDone.bind(null, node),
 					() => node.state !== "starting" && node.state !== "running",
 					() => nodeChange(node),
 					() => nodeInvalid(node)
-				)
+				))
 			);
 		});
 		let processing = true;
@@ -470,7 +471,7 @@ module.exports = class MultiCompiler {
 				) {
 					running++;
 					node.state = "starting";
-					run(node.compiler, nodeDone.bind(null, node));
+					run(node.compiler, node.setupResult, nodeDone.bind(null, node));
 					node.state = "running";
 				}
 			}
@@ -522,8 +523,9 @@ module.exports = class MultiCompiler {
 					}
 					return watching;
 				},
-				(compiler, initial, callback) => {
-					if (!compiler.watching.running) compiler.watching.invalidate();
+				(compiler, watching, callback) => {
+					if (compiler.watching !== watching) return;
+					if (!watching.running) watching.invalidate();
 				},
 				handler
 			);
@@ -546,7 +548,7 @@ module.exports = class MultiCompiler {
 		if (this.validateDependencies(callback)) {
 			this._runGraph(
 				() => {},
-				(compiler, callback) => compiler.run(callback),
+				(compiler, setupResult, callback) => compiler.run(callback),
 				(err, stats) => {
 					this.running = false;
 

package/lib/SourceMapDevToolPlugin.js

@@ -152,7 +152,7 @@ class SourceMapDevToolPlugin {
 		const fallbackModuleFilenameTemplate = this.fallbackModuleFilenameTemplate;
 		const requestShortener = compiler.requestShortener;
 		const options = this.options;
-		options.test = options.test || /\.(m?js|css)($|\?)/i;
+		options.test = options.test || /\.((c|m)?js|css)($|\?)/i;
 
 		const matchObject = ModuleFilenameHelpers.matchObject.bind(
 			undefined,

package/lib/Template.js

@@ -379,6 +379,7 @@ class Template {
 				source.add(Template.toNormalComment(module.identifier()) + "\n");
 				if (!module.shouldIsolate()) {
 					source.add(runtimeSource);
+					source.add("\n\n");
 				} else if (renderContext.runtimeTemplate.supportsArrowFunction()) {
 					source.add("(() => {\n");
 					if (renderContext.useStrict) source.add('\t"use strict";\n');

package/lib/Watching.js

@@ -10,6 +10,7 @@ const Stats = require("./Stats");
 /** @typedef {import("../declarations/WebpackOptions").WatchOptions} WatchOptions */
 /** @typedef {import("./Compilation")} Compilation */
 /** @typedef {import("./Compiler")} Compiler */
+/** @typedef {import("./FileSystemInfo").FileSystemInfoEntry} FileSystemInfoEntry */
 
 /**
  * @template T
@@ -67,6 +68,10 @@ class Watching {
 		});
 	}
 
+	/**
+	 * @param {ReadonlySet<string>} changedFiles changed files
+	 * @param {ReadonlySet<string>} removedFiles removed files
+	 */
 	_mergeWithCollected(changedFiles, removedFiles) {
 		if (!changedFiles) return;
 		if (!this._collectedChangedFiles) {
@@ -84,6 +89,13 @@ class Watching {
 		}
 	}
 
+	/**
+	 * @param {ReadonlyMap<string, FileSystemInfoEntry | "ignore">=} fileTimeInfoEntries info for files
+	 * @param {ReadonlyMap<string, FileSystemInfoEntry | "ignore">=} contextTimeInfoEntries info for directories
+	 * @param {ReadonlySet<string>=} changedFiles changed files
+	 * @param {ReadonlySet<string>=} removedFiles removed files
+	 * @returns {void}
+	 */
 	_go(fileTimeInfoEntries, contextTimeInfoEntries, changedFiles, removedFiles) {
 		this._initial = false;
 		if (this.startTime === null) this.startTime = Date.now();

package/lib/asset/AssetGenerator.js

@@ -141,7 +141,9 @@ class AssetGenerator extends Generator {
 								module.resourceResolveData &&
 								module.resourceResolveData.mimetype !== undefined
 							) {
-								mimeType = module.resourceResolveData.mimetype;
+								mimeType =
+									module.resourceResolveData.mimetype +
+									module.resourceResolveData.parameters;
 							} else if (ext) {
 								mimeType = mimeTypes.lookup(ext);
 							}
@@ -156,22 +158,33 @@ class AssetGenerator extends Generator {
 						}
 
 						let encodedContent;
-						switch (encoding) {
-							case "base64": {
-								encodedContent = originalSource.buffer().toString("base64");
-								break;
-							}
-							case false: {
-								const content = originalSource.source();
-								if (typeof content === "string") {
-									encodedContent = encodeURI(content);
-								} else {
-									encodedContent = encodeURI(content.toString("utf-8"));
+						if (
+							module.resourceResolveData &&
+							module.resourceResolveData.encoding === encoding
+						) {
+							encodedContent = module.resourceResolveData.encodedContent;
+						} else {
+							switch (encoding) {
+								case "base64": {
+									encodedContent = originalSource.buffer().toString("base64");
+									break;
+								}
+								case false: {
+									const content = originalSource.source();
+
+									if (typeof content !== "string") {
+										encodedContent = content.toString("utf-8");
+									}
+
+									encodedContent = encodeURIComponent(encodedContent).replace(
+										/[!'()*]/g,
+										character => "%" + character.codePointAt(0).toString(16)
+									);
+									break;
 								}
-								break;
+								default:
+									throw new Error(`Unsupported encoding '${encoding}'`);
 							}
-							default:
-								throw new Error(`Unsupported encoding '${encoding}'`);
 						}
 
 						encodedSource = `data:${mimeType}${

package/lib/container/ContainerPlugin.js

@@ -39,6 +39,7 @@ class ContainerPlugin {
 				type: "var",
 				name: options.name
 			},
+			runtime: options.runtime,
 			filename: options.filename || undefined,
 			exposes: parseOptions(
 				options.exposes,
@@ -60,7 +61,8 @@ class ContainerPlugin {
 	 * @returns {void}
 	 */
 	apply(compiler) {
-		const { name, exposes, shareScope, filename, library } = this._options;
+		const { name, exposes, shareScope, filename, library, runtime } =
+			this._options;
 
 		compiler.options.output.enabledLibraryTypes.push(library.type);
 
@@ -73,6 +75,7 @@ class ContainerPlugin {
 				{
 					name,
 					filename,
+					runtime,
 					library
 				},
 				error => {

package/lib/container/ModuleFederationPlugin.js

@@ -64,6 +64,7 @@ class ModuleFederationPlugin {
 					name: options.name,
 					library,
 					filename: options.filename,
+					runtime: options.runtime,
 					exposes: options.exposes
 				}).apply(compiler);
 			}

package/lib/dependencies/WorkerPlugin.js

@@ -270,7 +270,7 @@ class WorkerPlugin {
 							entryOptions.name = options.name;
 						}
 
-						if (!entryOptions.runtime) {
+						if (entryOptions.runtime === undefined) {
 							let i = workerIndexMap.get(parser.state) || 0;
 							workerIndexMap.set(parser.state, i + 1);
 							let name = `${cachedContextify(

package/lib/esm/ExportWebpackRequireRuntimeModule.js

@@ -0,0 +1,29 @@
+/*
+	MIT License http://www.opensource.org/licenses/mit-license.php
+*/
+
+"use strict";
+
+const RuntimeModule = require("../RuntimeModule");
+
+class ExportWebpackRequireRuntimeModule extends RuntimeModule {
+	constructor() {
+		super("export webpack runtime", RuntimeModule.STAGE_ATTACH);
+	}
+
+	/**
+	 * @returns {boolean} true, if the runtime module should get it's own scope
+	 */
+	shouldIsolate() {
+		return false;
+	}
+
+	/**
+	 * @returns {string} runtime code
+	 */
+	generate() {
+		return "export default __webpack_require__;";
+	}
+}
+
+module.exports = ExportWebpackRequireRuntimeModule;

package/lib/esm/ModuleChunkFormatPlugin.js

@@ -5,13 +5,18 @@
 
 "use strict";
 
-const { ConcatSource } = require("webpack-sources");
+const { ConcatSource, RawSource } = require("webpack-sources");
 const { RuntimeGlobals } = require("..");
 const HotUpdateChunk = require("../HotUpdateChunk");
 const Template = require("../Template");
 const {
-	getCompilationHooks
+	getCompilationHooks,
+	getChunkFilenameTemplate
 } = require("../javascript/JavascriptModulesPlugin");
+const {
+	generateEntryStartup,
+	updateHashForEntryStartup
+} = require("../javascript/StartupHelpers");
 
 /** @typedef {import("../Compiler")} Compiler */
 
@@ -30,8 +35,9 @@ class ModuleChunkFormatPlugin {
 					(chunk, set) => {
 						if (chunk.hasRuntime()) return;
 						if (compilation.chunkGraph.getNumberOfEntryModules(chunk) > 0) {
-							set.add(RuntimeGlobals.onChunksLoaded);
 							set.add(RuntimeGlobals.require);
+							set.add(RuntimeGlobals.startupEntrypoint);
+							set.add(RuntimeGlobals.externalInstallChunk);
 						}
 					}
 				);
@@ -39,7 +45,7 @@ class ModuleChunkFormatPlugin {
 				hooks.renderChunk.tap(
 					"ModuleChunkFormatPlugin",
 					(modules, renderContext) => {
-						const { chunk, chunkGraph } = renderContext;
+						const { chunk, chunkGraph, runtimeTemplate } = renderContext;
 						const hotUpdateChunk =
 							chunk instanceof HotUpdateChunk ? chunk : null;
 						const source = new ConcatSource();
@@ -68,9 +74,84 @@ class ModuleChunkFormatPlugin {
 								chunkGraph.getChunkEntryModulesWithChunkGroupIterable(chunk)
 							);
 							if (entries.length > 0) {
-								throw new Error(
-									"Entry modules in chunk is not implemented for module chunk format yet"
+								const runtimeChunk = entries[0][1].getRuntimeChunk();
+								const currentOutputName = compilation
+									.getPath(
+										getChunkFilenameTemplate(chunk, compilation.outputOptions),
+										{
+											chunk,
+											contentHashType: "javascript"
+										}
+									)
+									.split("/");
+								const runtimeOutputName = compilation
+									.getPath(
+										getChunkFilenameTemplate(
+											runtimeChunk,
+											compilation.outputOptions
+										),
+										{
+											chunk: runtimeChunk,
+											contentHashType: "javascript"
+										}
+									)
+									.split("/");
+
+								// remove filename, we only need the directory
+								const outputFilename = currentOutputName.pop();
+
+								// remove common parts
+								while (
+									currentOutputName.length > 0 &&
+									runtimeOutputName.length > 0 &&
+									currentOutputName[0] === runtimeOutputName[0]
+								) {
+									currentOutputName.shift();
+									runtimeOutputName.shift();
+								}
+
+								// create final path
+								const runtimePath =
+									(currentOutputName.length > 0
+										? "../".repeat(currentOutputName.length)
+										: "./") + runtimeOutputName.join("/");
+
+								const entrySource = new ConcatSource();
+								entrySource.add(source);
+								entrySource.add(";\n\n// load runtime\n");
+								entrySource.add(
+									`import __webpack_require__ from ${JSON.stringify(
+										runtimePath
+									)};\n`
+								);
+								entrySource.add(
+									`import * as __webpack_self_exports__ from ${JSON.stringify(
+										"./" + outputFilename
+									)};\n`
+								);
+								entrySource.add(
+									`${RuntimeGlobals.externalInstallChunk}(__webpack_self_exports__);\n`
+								);
+								const startupSource = new RawSource(
+									generateEntryStartup(
+										chunkGraph,
+										runtimeTemplate,
+										entries,
+										chunk,
+										false
+									)
+								);
+								entrySource.add(
+									hooks.renderStartup.call(
+										startupSource,
+										entries[entries.length - 1][0],
+										{
+											...renderContext,
+											inlined: false
+										}
+									)
 								);
+								return entrySource;
 							}
 						}
 						return source;
@@ -82,11 +163,10 @@ class ModuleChunkFormatPlugin {
 						if (chunk.hasRuntime()) return;
 						hash.update("ModuleChunkFormatPlugin");
 						hash.update("1");
-						// TODO
-						// const entries = Array.from(
-						// 	chunkGraph.getChunkEntryModulesWithChunkGroupIterable(chunk)
-						// );
-						// updateHashForEntryStartup(hash, chunkGraph, entries, chunk);
+						const entries = Array.from(
+							chunkGraph.getChunkEntryModulesWithChunkGroupIterable(chunk)
+						);
+						updateHashForEntryStartup(hash, chunkGraph, entries, chunk);
 					}
 				);
 			}

package/lib/esm/ModuleChunkLoadingPlugin.js

@@ -6,6 +6,7 @@
 "use strict";
 
 const RuntimeGlobals = require("../RuntimeGlobals");
+const ExportWebpackRequireRuntimeModule = require("./ExportWebpackRequireRuntimeModule");
 const ModuleChunkLoadingRuntimeModule = require("./ModuleChunkLoadingRuntimeModule");
 
 /** @typedef {import("../Compiler")} Compiler */
@@ -45,9 +46,21 @@ class ModuleChunkLoadingPlugin {
 				compilation.hooks.runtimeRequirementInTree
 					.for(RuntimeGlobals.baseURI)
 					.tap("ModuleChunkLoadingPlugin", handler);
+				compilation.hooks.runtimeRequirementInTree
+					.for(RuntimeGlobals.externalInstallChunk)
+					.tap("ModuleChunkLoadingPlugin", handler);
 				compilation.hooks.runtimeRequirementInTree
 					.for(RuntimeGlobals.onChunksLoaded)
 					.tap("ModuleChunkLoadingPlugin", handler);
+				compilation.hooks.runtimeRequirementInTree
+					.for(RuntimeGlobals.externalInstallChunk)
+					.tap("ModuleChunkLoadingPlugin", (chunk, set) => {
+						if (!isEnabledForChunk(chunk)) return;
+						compilation.addRuntimeModule(
+							chunk,
+							new ExportWebpackRequireRuntimeModule()
+						);
+					});
 
 				compilation.hooks.runtimeRequirementInTree
 					.for(RuntimeGlobals.ensureChunkHandlers)