webpack 5.36.0 → 5.37.1

package/README.md

@@ -169,17 +169,14 @@ or are automatically applied via regex from your webpack configuration.
 
 #### Transpiling
 
-|                                                                            Name                                                                            |     Status     |  Install Size   | Description                                                                                          |
-| :--------------------------------------------------------------------------------------------------------------------------------------------------------: | :------------: | :-------------: | :--------------------------------------------------------------------------------------------------- |
-| <a href="https://github.com/babel/babel-loader"><img width="48" height="48" title="babel-loader" src="https://worldvectorlogo.com/logos/babel-10.svg"></a> |  ![babel-npm]  |  ![babel-size]  | Loads ES2015+ code and transpiles to ES5 using <a href="https://github.com/babel/babel">Babel</a>    |
-|       <a href="https://github.com/jupl/traceur-loader"><img width="48" height="48" src="https://google.github.com/traceur-compiler/logo/tc.svg"></a>       | ![traceur-npm] | ![traceur-size] | Loads ES2015+ code and transpiles to ES5 using [Traceur](https://github.com/google/traceur-compiler) |
-|  <a href="https://github.com/TypeStrong/ts-loader"><img width="48" height="48" src="https://cdn.rawgit.com/Microsoft/TypeScript/master/doc/logo.svg"></a>  |  ![type-npm]   |  ![type-size]   | Loads TypeScript like JavaScript                                                                     |
-|    <a href="https://github.com/webpack-contrib/coffee-loader"><img width="48" height="48" src="https://worldvectorlogo.com/logos/coffeescript.svg"></a>    | ![coffee-npm]  | ![coffee-size]  | Loads CoffeeScript like JavaScript                                                                   |
+|                                                                            Name                                                                            |    Status     |  Install Size  | Description                                                                                       |
+| :--------------------------------------------------------------------------------------------------------------------------------------------------------: | :-----------: | :------------: | :------------------------------------------------------------------------------------------------ |
+| <a href="https://github.com/babel/babel-loader"><img width="48" height="48" title="babel-loader" src="https://worldvectorlogo.com/logos/babel-10.svg"></a> | ![babel-npm]  | ![babel-size]  | Loads ES2015+ code and transpiles to ES5 using <a href="https://github.com/babel/babel">Babel</a> |
+|  <a href="https://github.com/TypeStrong/ts-loader"><img width="48" height="48" src="https://cdn.rawgit.com/Microsoft/TypeScript/master/doc/logo.svg"></a>  |  ![type-npm]  |  ![type-size]  | Loads TypeScript like JavaScript                                                                  |
+|    <a href="https://github.com/webpack-contrib/coffee-loader"><img width="48" height="48" src="https://worldvectorlogo.com/logos/coffeescript.svg"></a>    | ![coffee-npm] | ![coffee-size] | Loads CoffeeScript like JavaScript                                                                |
 
 [babel-npm]: https://img.shields.io/npm/v/babel-loader.svg
 [babel-size]: https://packagephobia.com/badge?p=babel-loader
-[traceur-npm]: https://img.shields.io/npm/v/traceur-loader.svg
-[traceur-size]: https://packagephobia.com/badge?p=traceur-loader
 [coffee-npm]: https://img.shields.io/npm/v/coffee-loader.svg
 [coffee-size]: https://packagephobia.com/badge?p=coffee-loader
 [type-npm]: https://img.shields.io/npm/v/ts-loader.svg

package/lib/CacheFacade.js

@@ -90,9 +90,9 @@ class MultiItemCache {
 	 * @returns {Promise<void>} promise signals when the value is stored
 	 */
 	storePromise(data) {
-		return Promise.all(
-			this._items.map(item => item.storePromise(data))
-		).then(() => {});
+		return Promise.all(this._items.map(item => item.storePromise(data))).then(
+			() => {}
+		);
 	}
 }
 

package/lib/Chunk.js

@@ -547,9 +547,8 @@ class Chunk {
 			xor.add(chunkGraph.getModuleHash(m, this.runtime));
 		}
 		xor.updateHash(hash);
-		const entryModules = chunkGraph.getChunkEntryModulesWithChunkGroupIterable(
-			this
-		);
+		const entryModules =
+			chunkGraph.getChunkEntryModulesWithChunkGroupIterable(this);
 		for (const [m, chunkGroup] of entryModules) {
 			hash.update("entry");
 			hash.update(`${chunkGraph.getModuleId(m)}`);
@@ -568,9 +567,15 @@ class Chunk {
 			Array.from(this.groupsIterable, g => new Set(g.chunks))
 		);
 
-		for (const chunkGroup of this.groupsIterable) {
+		const initialQueue = new Set(this.groupsIterable);
+
+		for (const chunkGroup of initialQueue) {
 			for (const child of chunkGroup.childrenIterable) {
-				queue.add(child);
+				if (child instanceof Entrypoint) {
+					initialQueue.add(child);
+				} else {
+					queue.add(child);
+				}
 			}
 		}
 

package/lib/ChunkGraph.js

@@ -1446,17 +1446,37 @@ Caller might not support runtime-dependent code generation (opt-out via optimiza
 				runtime
 			).toString(16);
 			const connections = this.moduleGraph.getOutgoingConnections(module);
+			/** @type {Set<Module>} */
+			const activeNamespaceModules = new Set();
 			/** @type {Map<string, Module | Set<Module>>} */
 			const connectedModules = new Map();
-			for (const connection of connections) {
-				let stateInfo;
-				if (typeof runtime === "string") {
+			const processConnection = (connection, stateInfo) => {
+				const module = connection.module;
+				stateInfo += module.getExportsType(this.moduleGraph, strict);
+				// cspell:word Tnamespace
+				if (stateInfo === "Tnamespace") activeNamespaceModules.add(module);
+				else {
+					const oldModule = connectedModules.get(stateInfo);
+					if (oldModule === undefined) {
+						connectedModules.set(stateInfo, module);
+					} else if (oldModule instanceof Set) {
+						oldModule.add(module);
+					} else if (oldModule !== module) {
+						connectedModules.set(stateInfo, new Set([oldModule, module]));
+					}
+				}
+			};
+			if (runtime === undefined || typeof runtime === "string") {
+				for (const connection of connections) {
 					const state = connection.getActiveState(runtime);
 					if (state === false) continue;
-					stateInfo = activeStateToString(state);
-				} else {
+					processConnection(connection, state === true ? "T" : "O");
+				}
+			} else {
+				// cspell:word Tnamespace
+				for (const connection of connections) {
 					const states = new Set();
-					stateInfo = "";
+					let stateInfo = "";
 					forEachRuntime(
 						runtime,
 						runtime => {
@@ -1471,46 +1491,49 @@ Caller might not support runtime-dependent code generation (opt-out via optimiza
 						if (state === false) continue;
 						stateInfo = activeStateToString(state);
 					}
-				}
-				const module = connection.module;
-				stateInfo += module.getExportsType(this.moduleGraph, strict);
-				const oldModule = connectedModules.get(stateInfo);
-				if (oldModule === undefined) {
-					connectedModules.set(stateInfo, module);
-				} else if (oldModule instanceof Set) {
-					oldModule.add(module);
-				} else if (oldModule !== module) {
-					connectedModules.set(stateInfo, new Set([oldModule, module]));
+					processConnection(connection, stateInfo);
 				}
 			}
-			if (connectedModules.size === 0) return graphHash;
+			// cspell:word Tnamespace
+			if (activeNamespaceModules.size === 0 && connectedModules.size === 0)
+				return graphHash;
 			const connectedModulesInOrder =
 				connectedModules.size > 1
 					? Array.from(connectedModules).sort(([a], [b]) => (a < b ? -1 : 1))
 					: connectedModules;
 			const hash = createHash("md4");
+			const addModuleToHash = module => {
+				hash.update(
+					this._getModuleGraphHashBigInt(
+						this._getChunkGraphModule(module),
+						module,
+						runtime
+					).toString(16)
+				);
+			};
+			const addModulesToHash = modules => {
+				let xor = ZERO_BIG_INT;
+				for (const m of modules) {
+					xor =
+						xor ^
+						this._getModuleGraphHashBigInt(
+							this._getChunkGraphModule(m),
+							m,
+							runtime
+						);
+				}
+				hash.update(xor.toString(16));
+			};
+			if (activeNamespaceModules.size === 1)
+				addModuleToHash(activeNamespaceModules.values().next().value);
+			else if (activeNamespaceModules.size > 1)
+				addModulesToHash(activeNamespaceModules);
 			for (const [stateInfo, modules] of connectedModulesInOrder) {
 				hash.update(stateInfo);
 				if (modules instanceof Set) {
-					let xor = ZERO_BIG_INT;
-					for (const m of modules) {
-						xor =
-							xor ^
-							this._getModuleGraphHashBigInt(
-								this._getChunkGraphModule(m),
-								m,
-								runtime
-							);
-					}
-					hash.update(xor.toString(16));
+					addModulesToHash(modules);
 				} else {
-					hash.update(
-						this._getModuleGraphHashBigInt(
-							this._getChunkGraphModule(modules),
-							modules,
-							runtime
-						).toString(16)
-					);
+					addModuleToHash(modules);
 				}
 			}
 			hash.update(graphHash);

package/lib/Compilation.js

@@ -510,7 +510,8 @@ class Compilation {
 		 * @returns {FakeHook<Pick<AsyncSeriesHook<T>, "tap" | "tapAsync" | "tapPromise" | "name">>} fake hook which redirects
 		 */
 		const createProcessAssetsHook = (name, stage, getArgs, code) => {
-			const errorMessage = reason => `Can't automatically convert plugin using Compilation.hooks.${name} to Compilation.hooks.processAssets because ${reason}.
+			const errorMessage =
+				reason => `Can't automatically convert plugin using Compilation.hooks.${name} to Compilation.hooks.processAssets because ${reason}.
 BREAKING CHANGE: Asset processing hooks in Compilation has been merged into a single Compilation.hooks.processAssets hook.`;
 			const getOptions = options => {
 				if (typeof options === "string") options = { name: options };
@@ -1375,84 +1376,114 @@ BREAKING CHANGE: Asset processing hooks in Compilation has been merged into a si
 	 * @returns {void}
 	 */
 	_processModuleDependencies(module, callback) {
-		const dependencies = new Map();
-
 		/**
 		 * @type {Array<{factory: ModuleFactory, dependencies: Dependency[], originModule: Module|null}>}
 		 */
 		const sortedDependencies = [];
 
-		let currentBlock = module;
+		/** @type {DependenciesBlock} */
+		let currentBlock;
 
+		/** @type {Map<ModuleFactory, Map<string, Dependency[]>>} */
+		let dependencies;
+		/** @type {DepConstructor} */
 		let factoryCacheKey;
+		/** @type {ModuleFactory} */
+		let factoryCacheKey2;
+		/** @type {Map<string, Dependency[]>} */
 		let factoryCacheValue;
-		let factoryCacheValue2;
-		let listCacheKey;
+		/** @type {string} */
+		let listCacheKey1;
+		/** @type {string} */
+		let listCacheKey2;
+		/** @type {Dependency[]} */
 		let listCacheValue;
 
+		/**
+		 * @param {Dependency} dep dependency
+		 * @returns {void}
+		 */
 		const processDependency = dep => {
 			this.moduleGraph.setParents(dep, currentBlock, module);
 			const resourceIdent = dep.getResourceIdentifier();
-			if (resourceIdent) {
-				// Here webpack is using heuristic that assumes
-				// mostly esm dependencies would be used
-				// so we don't allocate extra string for them
+			if (resourceIdent !== undefined && resourceIdent !== null) {
 				const category = dep.category;
-				const cacheKey =
-					category === esmDependencyCategory
-						? resourceIdent
-						: `${category}${resourceIdent}`;
-				const constructor = dep.constructor;
-				let innerMap;
-				let factory;
+				const constructor = /** @type {DepConstructor} */ (dep.constructor);
 				if (factoryCacheKey === constructor) {
-					innerMap = factoryCacheValue;
-					if (listCacheKey === cacheKey) {
+					// Fast path 1: same constructor as prev item
+					if (listCacheKey1 === category && listCacheKey2 === resourceIdent) {
+						// Super fast path 1: also same resource
 						listCacheValue.push(dep);
 						return;
 					}
 				} else {
-					factory = this.dependencyFactories.get(dep.constructor);
+					const factory = this.dependencyFactories.get(constructor);
 					if (factory === undefined) {
 						throw new Error(
-							`No module factory available for dependency type: ${dep.constructor.name}`
+							`No module factory available for dependency type: ${constructor.name}`
 						);
 					}
-					innerMap = dependencies.get(factory);
-					if (innerMap === undefined) {
-						dependencies.set(factory, (innerMap = new Map()));
+					if (factoryCacheKey2 === factory) {
+						// Fast path 2: same factory as prev item
+						factoryCacheKey = constructor;
+						if (listCacheKey1 === category && listCacheKey2 === resourceIdent) {
+							// Super fast path 2: also same resource
+							listCacheValue.push(dep);
+							return;
+						}
+					} else {
+						// Slow path
+						if (factoryCacheKey2 !== undefined) {
+							// Archive last cache entry
+							if (dependencies === undefined) dependencies = new Map();
+							dependencies.set(factoryCacheKey2, factoryCacheValue);
+							factoryCacheValue = dependencies.get(factory);
+							if (factoryCacheValue === undefined) {
+								factoryCacheValue = new Map();
+							}
+						} else {
+							factoryCacheValue = new Map();
+						}
+						factoryCacheKey = constructor;
+						factoryCacheKey2 = factory;
 					}
-					factoryCacheKey = constructor;
-					factoryCacheValue = innerMap;
-					factoryCacheValue2 = factory;
 				}
-				let list = innerMap.get(cacheKey);
+				// Here webpack is using heuristic that assumes
+				// mostly esm dependencies would be used
+				// so we don't allocate extra string for them
+				const cacheKey =
+					category === esmDependencyCategory
+						? resourceIdent
+						: `${category}${resourceIdent}`;
+				let list = factoryCacheValue.get(cacheKey);
 				if (list === undefined) {
-					innerMap.set(cacheKey, (list = []));
+					factoryCacheValue.set(cacheKey, (list = []));
 					sortedDependencies.push({
-						factory: factoryCacheValue2,
+						factory: factoryCacheKey2,
 						dependencies: list,
 						originModule: module
 					});
 				}
 				list.push(dep);
-				listCacheKey = cacheKey;
+				listCacheKey1 = category;
+				listCacheKey2 = resourceIdent;
 				listCacheValue = list;
 			}
 		};
 
-		const processDependenciesBlock = block => {
-			if (block.dependencies) {
-				currentBlock = block;
-				for (const dep of block.dependencies) processDependency(dep);
-			}
-			if (block.blocks) {
-				for (const b of block.blocks) processDependenciesBlock(b);
-			}
-		};
-
 		try {
-			processDependenciesBlock(module);
+			/** @type {DependenciesBlock[]} */
+			const queue = [module];
+			do {
+				const block = queue.pop();
+				if (block.dependencies) {
+					currentBlock = block;
+					for (const dep of block.dependencies) processDependency(dep);
+				}
+				if (block.blocks) {
+					for (const b of block.blocks) queue.push(b);
+				}
+			} while (queue.length !== 0);
 		} catch (e) {
 			return callback(e);
 		}
@@ -1585,9 +1616,8 @@ BREAKING CHANGE: Asset processing hooks in Compilation has been merged into a si
 					let creatingModuleDuringBuildSet = undefined;
 					if (!recursive && this.buildQueue.isProcessing(originModule)) {
 						// Track build dependency
-						creatingModuleDuringBuildSet = this.creatingModuleDuringBuild.get(
-							originModule
-						);
+						creatingModuleDuringBuildSet =
+							this.creatingModuleDuringBuild.get(originModule);
 						if (creatingModuleDuringBuildSet === undefined) {
 							creatingModuleDuringBuildSet = new Set();
 							this.creatingModuleDuringBuild.set(
@@ -1716,11 +1746,8 @@ BREAKING CHANGE: Asset processing hooks in Compilation has been merged into a si
 							module: result
 						};
 					}
-					const {
-						fileDependencies,
-						contextDependencies,
-						missingDependencies
-					} = result;
+					const { fileDependencies, contextDependencies, missingDependencies } =
+						result;
 					if (fileDependencies) {
 						this.fileDependencies.addAll(fileDependencies);
 					}
@@ -2286,7 +2313,8 @@ BREAKING CHANGE: Asset processing hooks in Compilation has been merged into a si
 			}
 		] of this.entries) {
 			if (dependOn && runtime) {
-				const err = new WebpackError(`Entrypoint '${name}' has 'dependOn' and 'runtime' specified. This is not valid.
+				const err =
+					new WebpackError(`Entrypoint '${name}' has 'dependOn' and 'runtime' specified. This is not valid.
 Entrypoints that depend on other entrypoints do not have their own runtime.
 They will use the runtime(s) from referenced entrypoints instead.
 Remove the 'runtime' option from the entrypoint.`);
@@ -2327,11 +2355,12 @@ Remove the 'runtime' option from the entrypoint.`);
 				let chunk = this.namedChunks.get(runtime);
 				if (chunk) {
 					if (!runtimeChunks.has(chunk)) {
-						const err = new WebpackError(`Entrypoint '${name}' has a 'runtime' option which points to another entrypoint named '${runtime}'.
+						const err =
+							new WebpackError(`Entrypoint '${name}' has a 'runtime' option which points to another entrypoint named '${runtime}'.
 It's not valid to use other entrypoints as runtime chunk.
 Did you mean to use 'dependOn: ${JSON.stringify(
-							runtime
-						)}' instead to allow using entrypoint '${name}' within the runtime of entrypoint '${runtime}'? For this '${runtime}' must always be loaded when '${name}' is used.
+								runtime
+							)}' instead to allow using entrypoint '${name}' within the runtime of entrypoint '${runtime}'? For this '${runtime}' must always be loaded when '${name}' is used.
 Or do you want to use the entrypoints '${name}' and '${runtime}' independently on the same page with a shared runtime? In this case give them both the same value for the 'runtime' option. It must be a name not already used by an entrypoint.`);
 						const entryChunk = entry.getEntrypointChunk();
 						err.chunk = entryChunk;
@@ -2591,12 +2620,8 @@ Or do you want to use the entrypoints '${name}' and '${runtime}' independently o
 	_runCodeGenerationJobs(jobs, callback) {
 		let statModulesFromCache = 0;
 		let statModulesGenerated = 0;
-		const {
-			chunkGraph,
-			moduleGraph,
-			dependencyTemplates,
-			runtimeTemplate
-		} = this;
+		const { chunkGraph, moduleGraph, dependencyTemplates, runtimeTemplate } =
+			this;
 		const results = this.codeGenerationResults;
 		const errors = [];
 		asyncLib.eachLimit(
@@ -2743,17 +2768,15 @@ Or do you want to use the entrypoints '${name}' and '${runtime}' independently o
 		chunkGraphEntries = this._getChunkGraphEntries()
 	} = {}) {
 		const context = { chunkGraph, codeGenerationResults };
-		const additionalModuleRuntimeRequirements = this.hooks
-			.additionalModuleRuntimeRequirements;
+		const additionalModuleRuntimeRequirements =
+			this.hooks.additionalModuleRuntimeRequirements;
 		const runtimeRequirementInModule = this.hooks.runtimeRequirementInModule;
 		for (const module of modules) {
 			if (chunkGraph.getNumberOfModuleChunks(module) > 0) {
 				for (const runtime of chunkGraph.getModuleRuntimes(module)) {
 					let set;
-					const runtimeRequirements = codeGenerationResults.getRuntimeRequirements(
-						module,
-						runtime
-					);
+					const runtimeRequirements =
+						codeGenerationResults.getRuntimeRequirements(module, runtime);
 					if (runtimeRequirements && runtimeRequirements.size > 0) {
 						set = new Set(runtimeRequirements);
 					} else if (additionalModuleRuntimeRequirements.isUsed()) {
@@ -2793,9 +2816,8 @@ Or do you want to use the entrypoints '${name}' and '${runtime}' independently o
 		for (const treeEntry of chunkGraphEntries) {
 			const set = new Set();
 			for (const chunk of treeEntry.getAllReferencedChunks()) {
-				const runtimeRequirements = chunkGraph.getChunkRuntimeRequirements(
-					chunk
-				);
+				const runtimeRequirements =
+					chunkGraph.getChunkRuntimeRequirements(chunk);
 				for (const r of runtimeRequirements) set.add(r);
 			}
 
@@ -3193,9 +3215,9 @@ Or do you want to use the entrypoints '${name}' and '${runtime}' independently o
 			runtime,
 			runtimeTemplate
 		});
-		const moduleHashDigest = /** @type {string} */ (moduleHash.digest(
-			hashDigest
-		));
+		const moduleHashDigest = /** @type {string} */ (
+			moduleHash.digest(hashDigest)
+		);
 		chunkGraph.setModuleHashes(
 			module,
 			runtime,
@@ -3324,10 +3346,11 @@ Or do you want to use the entrypoints '${name}' and '${runtime}' independently o
 				}
 			}
 			circularRuntimeChunkInfo.sort(compareSelect(i => i.chunk, byId));
-			const err = new WebpackError(`Circular dependency between chunks with runtime (${Array.from(
-				circularRuntimeChunkInfo,
-				c => c.chunk.name || c.chunk.id
-			).join(", ")})
+			const err =
+				new WebpackError(`Circular dependency between chunks with runtime (${Array.from(
+					circularRuntimeChunkInfo,
+					c => c.chunk.name || c.chunk.id
+				).join(", ")})
 This prevents using hashes of each other and should be avoided.`);
 			err.chunk = circularRuntimeChunkInfo[0].chunk;
 			this.warnings.push(err);
@@ -3390,15 +3413,14 @@ This prevents using hashes of each other and should be avoided.`);
 					moduleGraph: this.moduleGraph,
 					runtimeTemplate: this.runtimeTemplate
 				});
-				const chunkHashDigest = /** @type {string} */ (chunkHash.digest(
-					hashDigest
-				));
+				const chunkHashDigest = /** @type {string} */ (
+					chunkHash.digest(hashDigest)
+				);
 				hash.update(chunkHashDigest);
 				chunk.hash = chunkHashDigest;
 				chunk.renderedHash = chunk.hash.substr(0, hashDigestLength);
-				const fullHashModules = chunkGraph.getChunkFullHashModulesIterable(
-					chunk
-				);
+				const fullHashModules =
+					chunkGraph.getChunkFullHashModulesIterable(chunk);
 				if (fullHashModules) {
 					fullHashChunks.add(chunk);
 				} else {
@@ -3429,9 +3451,9 @@ This prevents using hashes of each other and should be avoided.`);
 					runtime: chunk.runtime,
 					runtimeTemplate
 				});
-				const moduleHashDigest = /** @type {string} */ (moduleHash.digest(
-					hashDigest
-				));
+				const moduleHashDigest = /** @type {string} */ (
+					moduleHash.digest(hashDigest)
+				);
 				const oldHash = chunkGraph.getModuleHash(module, chunk.runtime);
 				chunkGraph.setModuleHashes(
 					module,
@@ -3444,9 +3466,9 @@ This prevents using hashes of each other and should be avoided.`);
 			const chunkHash = createHash(hashFunction);
 			chunkHash.update(chunk.hash);
 			chunkHash.update(this.hash);
-			const chunkHashDigest = /** @type {string} */ (chunkHash.digest(
-				hashDigest
-			));
+			const chunkHashDigest = /** @type {string} */ (
+				chunkHash.digest(hashDigest)
+			);
 			chunk.hash = chunkHashDigest;
 			chunk.renderedHash = chunk.hash.substr(0, hashDigestLength);
 			this.hooks.contentHash.call(chunk);
@@ -3963,8 +3985,8 @@ This prevents using hashes of each other and should be avoided.`);
 	 * from parent (or top level compiler) and creates a child Compilation
 	 *
 	 * @param {string} name name of the child compiler
-	 * @param {OutputOptions} outputOptions // Need to convert config schema to types for this
-	 * @param {Array<WebpackPluginInstance | WebpackPluginFunction>} plugins webpack plugins that will be applied
+	 * @param {OutputOptions=} outputOptions // Need to convert config schema to types for this
+	 * @param {Array<WebpackPluginInstance | WebpackPluginFunction>=} plugins webpack plugins that will be applied
 	 * @returns {Compiler} creates a child Compiler instance
 	 */
 	createChildCompiler(name, outputOptions, plugins) {
@@ -4021,11 +4043,8 @@ This prevents using hashes of each other and should be avoided.`);
 				// Create new chunk graph, chunk and entrypoint for the build time execution
 				const chunkGraph = new ChunkGraph(this.moduleGraph);
 				const runtime = "build time";
-				const {
-					hashFunction,
-					hashDigest,
-					hashDigestLength
-				} = this.outputOptions;
+				const { hashFunction, hashDigest, hashDigestLength } =
+					this.outputOptions;
 				const runtimeTemplate = this.runtimeTemplate;
 
 				const chunk = new Chunk("build time chunk");
@@ -4121,9 +4140,8 @@ This prevents using hashes of each other and should be avoided.`);
 					});
 					this.chunkGraph = old;
 
-					const runtimeModules = chunkGraph.getChunkRuntimeModulesIterable(
-						chunk
-					);
+					const runtimeModules =
+						chunkGraph.getChunkRuntimeModulesIterable(chunk);
 
 					// Hash runtime modules
 					for (const module of runtimeModules) {

package/lib/Compiler.js

@@ -263,6 +263,8 @@ class Compiler {
 		this._assetEmittingSourceCache = new WeakMap();
 		/** @private @type {Map<string, number>} */
 		this._assetEmittingWrittenFiles = new Map();
+		/** @private @type {Set<string>} */
+		this._assetEmittingPreviousFiles = new Set();
 	}
 
 	/**
@@ -556,6 +558,8 @@ class Compiler {
 			compilation.assets = { ...compilation.assets };
 			/** @type {Map<string, { path: string, source: Source, size: number, waiting: { cacheEntry: any, file: string }[] }>} */
 			const caseInsensitiveMap = new Map();
+			/** @type {Set<string>} */
+			const allTargetPaths = new Set();
 			asyncLib.forEachLimit(
 				assets,
 				15,
@@ -583,11 +587,11 @@ class Compiler {
 							outputPath,
 							targetFile
 						);
+						allTargetPaths.add(targetPath);
 
 						// check if the target file has already been written by this Compiler
-						const targetFileGeneration = this._assetEmittingWrittenFiles.get(
-							targetPath
-						);
+						const targetFileGeneration =
+							this._assetEmittingWrittenFiles.get(targetPath);
 
 						// create an cache entry for this Source if not already existing
 						let cacheEntry = this._assetEmittingSourceCache.get(source);
@@ -617,7 +621,8 @@ class Compiler {
 									}
 									alreadyWritten();
 								} else {
-									const err = new WebpackError(`Prevent writing to file that only differs in casing or query string from already written file.
+									const err =
+										new WebpackError(`Prevent writing to file that only differs in casing or query string from already written file.
 This will lead to a race-condition and corrupted files on case-insensitive file systems.
 ${targetPath}
 ${other}`);
@@ -775,18 +780,22 @@ ${other}`);
 							// check if the Source has been written to this target file
 							const writtenGeneration = cacheEntry.writtenTo.get(targetPath);
 							if (writtenGeneration === targetFileGeneration) {
-								// if yes, we skip writing the file
-								// as it's already there
-								// (we assume one doesn't remove files while the Compiler is running)
+								// if yes, we may skip writing the file
+								// if it's already there
+								// (we assume one doesn't modify files while the Compiler is running, other then removing them)
 
-								compilation.updateAsset(file, cacheEntry.sizeOnlySource, {
-									size: cacheEntry.sizeOnlySource.size()
-								});
+								if (this._assetEmittingPreviousFiles.has(targetPath)) {
+									// We assume that assets from the last compilation say intact on disk (they are not removed)
+									compilation.updateAsset(file, cacheEntry.sizeOnlySource, {
+										size: cacheEntry.sizeOnlySource.size()
+									});
 
-								return callback();
-							}
-
-							if (!immutable) {
+									return callback();
+								} else {
+									// Settings immutable will make it accept file content without comparing when file exist
+									immutable = true;
+								}
+							} else if (!immutable) {
 								if (checkSimilarFile()) return;
 								// We wrote to this file before which has very likely a different content
 								// skip comparing and assume content is different for performance
@@ -822,7 +831,12 @@ ${other}`);
 				err => {
 					// Clear map to free up memory
 					caseInsensitiveMap.clear();
-					if (err) return callback(err);
+					if (err) {
+						this._assetEmittingPreviousFiles.clear();
+						return callback(err);
+					}
+
+					this._assetEmittingPreviousFiles = allTargetPaths;
 
 					this.hooks.afterEmit.callAsync(compilation, err => {
 						if (err) return callback(err);
@@ -917,8 +931,8 @@ ${other}`);
 	 * @param {Compilation} compilation the compilation
 	 * @param {string} compilerName the compiler's name
 	 * @param {number} compilerIndex the compiler's index
-	 * @param {OutputOptions} outputOptions the output options
-	 * @param {WebpackPluginInstance[]} plugins the plugins to apply
+	 * @param {OutputOptions=} outputOptions the output options
+	 * @param {WebpackPluginInstance[]=} plugins the plugins to apply
 	 * @returns {Compiler} a child compiler
 	 */
 	createChildCompiler(