webpack 5.110.3 → 5.111.0

package/lib/dependencies/HarmonyExportImportedSpecifierDependency.js

@@ -14,9 +14,11 @@ const Template = require("../Template");
 const {
 	InlinedUsedName,
 	isExportInlined,
-	isInlineEnabled
+	isInlineEnabled,
+	isInlineExportsEnabled
 } = require("../optimize/InlineExports");
 const {
+	getKnownExportNames,
 	getMakeDeferredNamespaceModeFromExportsType
 } = require("../runtime/MakeDeferredNamespaceObjectRuntime");
 const { countIterable } = require("../util/IterableHelpers");
@@ -29,6 +31,9 @@ const {
 	keyToRuntime
 } = require("../util/runtime");
 const HarmonyExportInitFragment = require("./HarmonyExportInitFragment");
+
+const { ExportBindingType } = HarmonyExportInitFragment;
+
 const HarmonyImportDependency = require("./HarmonyImportDependency");
 const HarmonyLinkingError = require("./HarmonyLinkingError");
 const { ImportPhaseUtils } = require("./ImportPhase");
@@ -44,7 +49,8 @@ const processExportInfo = require("./processExportInfo");
  * 	RawReferencedExports,
  * 	ReferencedExports,
  * 	TRANSITIVE,
- * 	ExportInfoName
+ * 	ExportInfoName,
+ * 	UpdateHashContext
  * } from "../Dependency"
  */
 /** @import { DependencyTemplateContext } from "../DependencyTemplate" */
@@ -58,6 +64,7 @@ const processExportInfo = require("./processExportInfo");
  * } from "../Module"
  */
 /** @import ModuleGraph from "../ModuleGraph" */
+/** @import Hash from "../util/Hash" */
 /**
  * @import ModuleGraphConnection, {
  * 	ConnectionState
@@ -829,6 +836,31 @@ class HarmonyExportImportedSpecifierDependency extends HarmonyImportDependency {
 		};
 	}
 
+	/**
+	 * Updates the hash with the data contributed by this instance.
+	 * @param {Hash} hash hash to be updated
+	 * @param {UpdateHashContext} context context
+	 * @returns {void}
+	 */
+	updateHash(hash, context) {
+		const { chunkGraph, runtime } = context;
+		const moduleGraph = chunkGraph.moduleGraph;
+		if (!isInlineExportsEnabled(moduleGraph)) return;
+		const module = moduleGraph.getModule(this);
+		if (!module || !isInlineEnabled(module)) return;
+		const mode = this.getMode(moduleGraph, runtime);
+		if (mode.type !== "normal-reexport") return;
+		const exportsInfo = moduleGraph.getExportsInfo(module);
+		for (const item of /** @type {NormalReexportItem[]} */ (mode.items)) {
+			if (item.hidden || item.checked) continue;
+			const usedName = exportsInfo.getUsedName(item.ids, runtime);
+			if (usedName instanceof InlinedUsedName) {
+				hash.update(`${item.name}:${item.ids.join(".")}:`);
+				usedName.updateHash(hash);
+			}
+		}
+	}
+
 	/**
 	 * Gets module evaluation side effects state.
 	 * @param {ModuleGraph} moduleGraph the module graph
@@ -1581,7 +1613,19 @@ HarmonyExportImportedSpecifierDependency.Template = class HarmonyExportImportedS
 				);
 				break;
 
-			case "reexport-namespace-object":
+			case "reexport-namespace-object": {
+				let value = namespaceImportVar;
+
+				// The re-exported binding is the namespace itself, so it has to be
+				// the same object every importer of that module is handed.
+				if (
+					importedModule.buildInfo &&
+					importedModule.buildInfo.specNamespaceObject
+				) {
+					runtimeRequirements.add(RuntimeGlobals.specNamespaceObject);
+					value = `${RuntimeGlobals.specNamespaceObject}(${value})`;
+				}
+
 				initFragments.push(
 					this.getReexportFragment(
 						module,
@@ -1589,12 +1633,13 @@ HarmonyExportImportedSpecifierDependency.Template = class HarmonyExportImportedS
 						moduleGraph
 							.getExportsInfo(module)
 							.getUsedName(/** @type {string} */ (mode.name), runtime),
-						namespaceImportVar,
+						value,
 						"",
 						runtimeRequirements
 					)
 				);
 				break;
+			}
 
 			case "normal-reexport": {
 				// loop-invariants hoisted out of the per-item loop below (a barrel
@@ -1729,7 +1774,10 @@ HarmonyExportImportedSpecifierDependency.Template = class HarmonyExportImportedS
 
 		/** @type {ExportMap} */
 		const map = new Map();
-		map.set(key, `/* ${comment} */ ${returnValue}`);
+		map.set(key, {
+			value: `/* ${comment} */ ${returnValue}`,
+			type: ExportBindingType.Getter
+		});
 
 		return new HarmonyExportInitFragment(module.exportsArgument, map);
 	}
@@ -1756,12 +1804,12 @@ HarmonyExportImportedSpecifierDependency.Template = class HarmonyExportImportedS
 
 		/** @type {ExportMap} */
 		const map = new Map();
-		map.set(
-			key,
-			`/* reexport fake namespace object from non-harmony */ ${name}_namespace_cache || (${name}_namespace_cache = ${
+		map.set(key, {
+			value: `/* reexport fake namespace object from non-harmony */ ${name}_namespace_cache || (${name}_namespace_cache = ${
 				RuntimeGlobals.createFakeNamespaceObject
-			}(${name}${fakeType ? `, ${fakeType}` : ""}))`
-		);
+			}(${name}${fakeType ? `, ${fakeType}` : ""}))`,
+			type: ExportBindingType.Getter
+		});
 
 		return [
 			new InitFragment(
@@ -1800,10 +1848,20 @@ HarmonyExportImportedSpecifierDependency.Template = class HarmonyExportImportedS
 		const map = new Map();
 		const moduleId = JSON.stringify(chunkGraph.getModuleId(module));
 		const mode = getMakeDeferredNamespaceModeFromExportsType(exportsType);
-		map.set(
-			key,
-			`/* reexport deferred namespace object */ ${name}_deferred_namespace_cache || (${name}_deferred_namespace_cache = ${RuntimeGlobals.makeDeferredNamespaceObject}(${moduleId}, ${mode}))`
+		const names = getKnownExportNames(
+			chunkGraph.moduleGraph,
+			module,
+			exportsType
+		);
+		runtimeRequirements.add(
+			names
+				? RuntimeGlobals.hasSealedDeferredNamespace
+				: RuntimeGlobals.hasSynthesizedDeferredNamespace
 		);
+		map.set(key, {
+			value: `/* reexport deferred namespace object */ ${name}_deferred_namespace_cache || (${name}_deferred_namespace_cache = ${RuntimeGlobals.makeDeferredNamespaceObject}(${moduleId}, ${mode}${names ? `, ${JSON.stringify(names)}` : ""}))`,
+			type: ExportBindingType.Getter
+		});
 
 		return [
 			new InitFragment(

package/lib/dependencies/HarmonyExportInitFragment.js

@@ -35,9 +35,19 @@ const joinIterableWithComma = (iterable) => {
 	return str;
 };
 
-/** @typedef {Map<UsedName, string>} ExportMap */
+const ExportBindingType = Object.freeze({
+	Getter: 0b00,
+	Value: 0b01
+});
+
+/** @typedef {Map<UsedName, { value: string, type: typeof ExportBindingType.Getter | typeof ExportBindingType.Value }>} ExportMap */
 /** @typedef {Set<string>} UnusedExports */
-/** @import { OnDemandGeneration } from "./ExportBindingInitFragment" */
+
+/**
+ * Lets a consumer take over the rendered `d()` call at its required position.
+ * End-position value bindings cannot move before the module body.
+ * @typedef {(source: string, placeAtEnd: boolean) => boolean} OnDemandGeneration
+ */
 
 /** @type {ExportMap} */
 const EMPTY_MAP = new Map();
@@ -71,6 +81,49 @@ class HarmonyExportInitFragment extends InitFragment {
 		this.unusedExports = unusedExports;
 		/** @type {OnDemandGeneration | undefined} */
 		this.onDemand = onDemand;
+
+		this._generated = false;
+		this._defsValue = undefined;
+		this._defsGetter = undefined;
+	}
+
+	/**
+	 * Returns the source code that will be included as initialization code.
+	 * @param {GenerateContext} context context
+	 * @returns {void}
+	 */
+	_generate({ runtimeTemplate }) {
+		if (this._generated) return;
+		this._generated = true;
+
+		if (this.exportMap.size > 0) {
+			/** @type {string[]} */
+			const _defsValue = [];
+			const _defsGetter = [];
+			const orderedExportMap =
+				this.exportMap.size > 1
+					? [...this.exportMap].sort(([a], [b]) => (a < b ? -1 : 1))
+					: this.exportMap;
+			for (const [key, { value, type }] of orderedExportMap) {
+				switch (type) {
+					case ExportBindingType.Getter:
+						_defsGetter.push(
+							`\n/* harmony export */   ${propertyName(
+								/** @type {string} */ (key)
+							)}: ${runtimeTemplate.returningFunction(value)}`
+						);
+						break;
+
+					case ExportBindingType.Value:
+						_defsValue.push(
+							`\n/* harmony export */   ${JSON.stringify(key)}, 0, ${value}`
+						);
+				}
+			}
+
+			this._defsGetter = _defsGetter;
+			this._defsValue = _defsValue;
+		}
 	}
 
 	/**
@@ -85,12 +138,15 @@ class HarmonyExportInitFragment extends InitFragment {
 		/** @type {undefined | UnusedExports} */
 		let unusedExports;
 		let unusedExportsOwned = false;
+		/** @type {OnDemandGeneration=} */
+		let onDemand;
 
 		for (const fragment of fragments) {
 			if (fragment.exportMap.size !== 0) {
 				if (exportMap === undefined) {
 					exportMap = fragment.exportMap;
 					exportMapOwned = false;
+					onDemand = fragment.onDemand;
 				} else {
 					if (!exportMapOwned) {
 						exportMap = new Map(exportMap);
@@ -98,6 +154,7 @@ class HarmonyExportInitFragment extends InitFragment {
 					}
 					for (const [key, value] of fragment.exportMap) {
 						if (!exportMap.has(key)) exportMap.set(key, value);
+						onDemand = onDemand || fragment.onDemand;
 					}
 				}
 			}
@@ -120,7 +177,7 @@ class HarmonyExportInitFragment extends InitFragment {
 			this.exportsArgument,
 			exportMap,
 			unusedExports,
-			this.onDemand
+			onDemand
 		);
 	}
 
@@ -167,7 +224,10 @@ class HarmonyExportInitFragment extends InitFragment {
 	 * @param {GenerateContext} context context
 	 * @returns {string | Source | undefined} the source code that will be included as initialization code
 	 */
-	getContent({ runtimeTemplate, runtimeRequirements }) {
+	getContent(context) {
+		this._generate(context);
+
+		const { runtimeRequirements } = context;
 		const unusedPart =
 			this.unusedExports.size > 1
 				? `/* unused harmony exports ${joinIterableWithComma(
@@ -177,35 +237,55 @@ class HarmonyExportInitFragment extends InitFragment {
 					? `/* unused harmony export ${first(this.unusedExports)} */\n`
 					: "";
 		let definePart = "";
-		if (this.exportMap.size > 0) {
-			/** @type {string[]} */
-			const definitions = [];
-			const orderedExportMap =
-				this.exportMap.size > 1
-					? [...this.exportMap].sort(([a], [b]) => (a < b ? -1 : 1))
-					: this.exportMap;
-			for (const [key, value] of orderedExportMap) {
-				definitions.push(
-					`\n/* harmony export */   ${propertyName(
-						/** @type {string} */ (key)
-					)}: ${runtimeTemplate.returningFunction(value)}`
-				);
-			}
+
+		if (this._defsGetter && this._defsGetter.length) {
 			// Requested even when the call is taken over below: whoever took it may still
 			// emit it, and by then the requirement set is closed.
 			runtimeRequirements.add(RuntimeGlobals.exports);
 			runtimeRequirements.add(RuntimeGlobals.definePropertyGetters);
 			definePart = `/* harmony export */ ${
 				RuntimeGlobals.definePropertyGetters
-			}(${this.exportsArgument}, {${definitions.join(
+			}(${this.exportsArgument}, {${this._defsGetter.join(
 				","
 			)}\n/* harmony export */ });\n`;
 			if (this.onDemand !== undefined && this.onDemand(definePart, false)) {
 				definePart = "";
 			}
 		}
+
 		return `${definePart}${unusedPart}`;
 	}
+
+	/**
+	 * Returns the source code that will be included at the end of the module.
+	 * @param {GenerateContext} context context
+	 * @returns {string | Source | undefined} the source code that will be included at the end of the module
+	 */
+	getEndContent({ runtimeRequirements }) {
+		let definePart = "";
+
+		if (this._defsValue && this._defsValue.length) {
+			// Requested even when the call is taken over below: whoever took it may still
+			// emit it, and by then the requirement set is closed.
+			runtimeRequirements.add(RuntimeGlobals.exports);
+			runtimeRequirements.add(RuntimeGlobals.definePropertyGetters);
+			// Only this fragment emits the array form, so the runtime helper drops the
+			// branch reading it unless this asks for it.
+			runtimeRequirements.add(RuntimeGlobals.definePropertyGettersFromArray);
+			const definition = `/* harmony export */ ${
+				RuntimeGlobals.definePropertyGetters
+			}(${this.exportsArgument}, [${this._defsValue.join(",")}\n/* harmony export */ ]);\n`;
+
+			definePart =
+				this.onDemand !== undefined && this.onDemand(definition, true)
+					? definePart
+					: `\n${definition}`;
+		}
+
+		return definePart;
+	}
 }
 
 module.exports = HarmonyExportInitFragment;
+
+HarmonyExportInitFragment.ExportBindingType = ExportBindingType;

package/lib/dependencies/HarmonyExportSpecifierDependency.js

@@ -9,8 +9,10 @@ const Dependency = require("../Dependency");
 const { InlinedUsedName } = require("../optimize/InlineExports");
 const makeSerializable = require("../util/makeSerializable");
 const memoize = require("../util/memoize");
-const ExportBindingInitFragment = require("./ExportBindingInitFragment");
 const HarmonyExportInitFragment = require("./HarmonyExportInitFragment");
+
+const { ExportBindingType } = HarmonyExportInitFragment;
+
 const NullDependency = require("./NullDependency");
 
 /** @import { ReplaceSource } from "webpack-sources" */
@@ -180,7 +182,7 @@ HarmonyExportSpecifierDependency.Template = class HarmonyExportSpecifierDependen
 			return;
 		}
 
-		const canUseValueBinding =
+		const valueFormat =
 			dep.constValue !== undefined &&
 			/** @type {import("../Module").BuildInfo} */ (module.buildInfo)
 				.isCircular === false;
@@ -200,34 +202,20 @@ HarmonyExportSpecifierDependency.Template = class HarmonyExportSpecifierDependen
 					) === true
 			: undefined;
 
-		if (canUseValueBinding) {
-			initFragments.push(
-				new ExportBindingInitFragment(
-					module.exportsArgument,
-					[
-						{
-							name: used,
-							value: `/* binding */ ${dep.id}`,
-							bindingType: "value"
-						}
-					],
-					true,
-					onDemand
-				)
-			);
-		} else {
-			/** @type {ExportMap} */
-			const map = new Map();
-			map.set(used, `/* binding */ ${dep.id}`);
-			initFragments.push(
-				new HarmonyExportInitFragment(
-					module.exportsArgument,
-					map,
-					undefined,
-					onDemand
-				)
-			);
-		}
+		/** @type {ExportMap} */
+		const map = new Map();
+		map.set(used, {
+			value: `/* binding */ ${dep.id}`,
+			type: valueFormat ? ExportBindingType.Value : ExportBindingType.Getter
+		});
+		initFragments.push(
+			new HarmonyExportInitFragment(
+				module.exportsArgument,
+				map,
+				undefined,
+				onDemand
+			)
+		);
 	}
 };
 

package/lib/dependencies/HarmonyImportBareSideEffectDependency.js

@@ -0,0 +1,59 @@
+/*
+	MIT License http://www.opensource.org/licenses/mit-license.php
+	Author Alexander Akait @alexander-akait
+*/
+
+"use strict";
+
+const { ASSET_TYPE } = require("../ModuleSourceTypeConstants");
+const makeSerializable = require("../util/makeSerializable");
+const HarmonyImportSideEffectDependency = require("./HarmonyImportSideEffectDependency");
+
+/** @import Module from "../Module" */
+/** @import ModuleGraph from "../ModuleGraph" */
+/** @import { GetConditionFn } from "../Dependency" */
+
+/**
+ * Whether a module is emitted as a file of its own, asked of the module so a
+ * plugin emitting the same way is treated alike. `buildInfo.filename` cannot
+ * serve here: generation sets it long after a connection has to know whether
+ * it is active.
+ * @param {Module} module the module to look up
+ * @returns {boolean} true when it emits a file
+ */
+const emitsOwnFile = (module) => module.getSourceTypes().has(ASSET_TYPE);
+
+/**
+ * An `import "..."` that declares no binding. It is a separate class rather
+ * than a flag so it costs nothing per instance, and the bound form — much the
+ * more common one — keeps the base class and its inline caches untouched.
+ */
+class HarmonyImportBareSideEffectDependency extends HarmonyImportSideEffectDependency {
+	/**
+	 * Returns function to determine if the connection is active.
+	 * @param {ModuleGraph} moduleGraph module graph
+	 * @returns {null | false | GetConditionFn} function to determine if the connection is active
+	 */
+	getCondition(moduleGraph) {
+		return (connection) => {
+			const refModule = connection.resolvedModule;
+
+			if (!refModule) return true;
+			// Nothing reads the module, so emitting its file is the only thing the
+			// import can have been written for.
+			if (emitsOwnFile(refModule)) return true;
+
+			return refModule.getSideEffectsConnectionState(moduleGraph);
+		};
+	}
+}
+
+makeSerializable(
+	HarmonyImportBareSideEffectDependency,
+	"webpack/lib/dependencies/HarmonyImportBareSideEffectDependency"
+);
+
+HarmonyImportBareSideEffectDependency.Template =
+	HarmonyImportSideEffectDependency.Template;
+
+module.exports = HarmonyImportBareSideEffectDependency;

package/lib/dependencies/HarmonyImportDependency.js

@@ -114,7 +114,12 @@ const getDeferredExports = (module) => {
 	for (const dep of module.dependencies) {
 		// TODO remove in webpack 6
 		// These may be missing on custom dependency types not extending the base Dependency
-		if (!("getLazyUntil" in dep) || !("isLazy" in dep)) continue;
+		if (
+			typeof dep.getLazyUntil !== "function" ||
+			typeof dep.isLazy !== "function"
+		) {
+			continue;
+		}
 		if (!dep.isLazy()) continue;
 		const until = dep.getLazyUntil();
 		if (until === Dependency.LAZY_UNTIL_FALLBACK) return true;

package/lib/dependencies/HarmonyImportDependencyParserPlugin.js

@@ -18,6 +18,7 @@ const HarmonyAcceptDependency = require("./HarmonyAcceptDependency");
 const HarmonyAcceptImportDependency = require("./HarmonyAcceptImportDependency");
 const HarmonyEvaluatedImportSpecifierDependency = require("./HarmonyEvaluatedImportSpecifierDependency");
 const HarmonyExports = require("./HarmonyExports");
+const HarmonyImportBareSideEffectDependency = require("./HarmonyImportBareSideEffectDependency");
 const {
 	ExportPresenceModes,
 	getNonOptionalPart
@@ -311,7 +312,13 @@ class HarmonyImportDependencyParserPlugin {
 				parser.state.current.addError(error);
 			}
 
-			const sideEffectDep = new HarmonyImportSideEffectDependency(
+			// A declaration binding nothing was written for what importing produces,
+			// which for a module emitting its own file is that file.
+			const SideEffectDependency =
+				statement.specifiers.length === 0
+					? HarmonyImportBareSideEffectDependency
+					: HarmonyImportSideEffectDependency;
+			const sideEffectDep = new SideEffectDependency(
 				/** @type {string} */ (source),
 				parser.state.lastHarmonyImportOrder,
 				phase,

package/lib/dependencies/HarmonyImportSpecifierDependency.js

@@ -26,10 +26,11 @@ const HarmonyImportGuard = require("./HarmonyImportGuard");
 const { ImportPhaseUtils } = require("./ImportPhase");
 
 /** @import { ReplaceSource } from "webpack-sources" */
-/** @import { GetConditionFn, ReferencedExports } from "../Dependency" */
+/** @import { GetConditionFn, ReferencedExports, UpdateHashContext } from "../Dependency" */
 /** @import { DependencyTemplateContext } from "../DependencyTemplate" */
 /** @import Module, { BuildMeta } from "../Module" */
 /** @import ModuleGraph from "../ModuleGraph" */
+/** @import Hash from "../util/Hash" */
 /**
  * @import ModuleGraphConnection, {
  * 	ConnectionState
@@ -262,6 +263,28 @@ class HarmonyImportSpecifierDependency extends HarmonyImportDependency {
 		return condition;
 	}
 
+	/**
+	 * Updates the hash with the data contributed by this instance.
+	 * @param {Hash} hash hash to be updated
+	 * @param {UpdateHashContext} context context
+	 * @returns {void}
+	 */
+	updateHash(hash, context) {
+		const { chunkGraph, runtime } = context;
+		const moduleGraph = chunkGraph.moduleGraph;
+		if (!isInlineExportsEnabled(moduleGraph)) return;
+		const module = moduleGraph.getModule(this);
+		if (!module || !isInlineEnabled(module)) return;
+		const ids = this.getIds(moduleGraph);
+		if (ids.length === 0) return;
+		const exportsInfo = moduleGraph.getExportsInfo(module);
+		if (!exportsInfo.hasInlinedUsedName(ids, runtime)) return;
+		const usedName = exportsInfo.getUsedName(ids, runtime);
+		if (usedName instanceof InlinedUsedName) {
+			usedName.updateHash(hash);
+		}
+	}
+
 	/**
 	 * Gets module evaluation side effects state.
 	 * @param {ModuleGraph} moduleGraph the module graph

package/lib/dependencies/HarmonyModulesPlugin.js

@@ -20,6 +20,7 @@ const HarmonyExportExpressionDependency = require("./HarmonyExportExpressionDepe
 const HarmonyExportHeaderDependency = require("./HarmonyExportHeaderDependency");
 const HarmonyExportImportedSpecifierDependency = require("./HarmonyExportImportedSpecifierDependency");
 const HarmonyExportSpecifierDependency = require("./HarmonyExportSpecifierDependency");
+const HarmonyImportBareSideEffectDependency = require("./HarmonyImportBareSideEffectDependency");
 const HarmonyImportDependencyParserPlugin = require("./HarmonyImportDependencyParserPlugin");
 const HarmonyImportSideEffectDependency = require("./HarmonyImportSideEffectDependency");
 const HarmonyImportSpecifierDependency = require("./HarmonyImportSpecifierDependency");
@@ -34,6 +35,7 @@ const TopLevelAwaitDependency = require("./TopLevelAwaitDependency");
  */
 /** @import Compiler from "../Compiler" */
 /** @import Parser from "../javascript/JavascriptParser" */
+/** @import { BuildInfo } from "../Module" */
 
 /**
  * Defines the harmony modules plugin options type used by this module.
@@ -81,6 +83,15 @@ class HarmonyModulesPlugin {
 					new HarmonyImportSideEffectDependency.Template()
 				);
 
+				compilation.dependencyFactories.set(
+					HarmonyImportBareSideEffectDependency,
+					normalModuleFactory
+				);
+				compilation.dependencyTemplates.set(
+					HarmonyImportBareSideEffectDependency,
+					new HarmonyImportBareSideEffectDependency.Template()
+				);
+
 				compilation.dependencyFactories.set(
 					HarmonyImportSpecifierDependency,
 					normalModuleFactory
@@ -149,6 +160,15 @@ class HarmonyModulesPlugin {
 						return;
 					}
 
+					if (parserOptions.specNamespaceObject) {
+						// Recorded on the module, because an importer asks the module it
+						// imports whether its namespace is a spec exotic object.
+						parser.hooks.program.tap(PLUGIN_NAME, () => {
+							/** @type {BuildInfo} */
+							(parser.state.module.buildInfo).specNamespaceObject = true;
+						});
+					}
+
 					new HarmonyDetectionParserPlugin().apply(parser);
 					new HarmonyImportDependencyParserPlugin(parserOptions).apply(parser);
 					new HarmonyExportDependencyParserPlugin(parserOptions).apply(parser);

package/lib/dependencies/HtmlEntryDependency.js

@@ -7,6 +7,7 @@
 const {
 	CSS_IMPORT_TYPE,
 	CSS_TYPE,
+	HTML_TYPE,
 	JAVASCRIPT_TYPE
 } = require("../ModuleSourceTypeConstants");
 const ResourceHintPlugin = require("../prefetch/ResourceHintPlugin");
@@ -587,6 +588,47 @@ const buildLinkTag = (rel, attrs) =>
 			: ""
 	}>`;
 
+/**
+ * The chunks a hint means when it names a page: a page loads no JavaScript of
+ * its own, so the hint follows the entries the parser extracted from it.
+ * @param {import("../Compilation")} compilation compilation
+ * @param {Chunk} chunk chunk a hint resolved to
+ * @returns {Chunk[]} the chunks to hint at
+ */
+const resolvePageChunk = (compilation, chunk) => {
+	const { chunkGraph } = compilation;
+	const modules = chunkGraph.getChunkModulesIterableBySourceType(
+		chunk,
+		HTML_TYPE
+	);
+	// A page with a JavaScript side of its own (an `output.library` entry) is
+	// hinted too — `chunkHasJs` can't say so, it holds for any runtime chunk.
+	const javascript = chunkGraph.getChunkModulesIterableBySourceType(
+		chunk,
+		JAVASCRIPT_TYPE
+	);
+	/** @type {Chunk[]} */
+	const chunks = javascript === undefined ? [] : [chunk];
+	// A chunk carrying no page stands for itself; a page stands for the entries
+	// extracted from it, so one that extracted nothing hints nothing.
+	if (modules === undefined) return chunks.length === 0 ? [chunk] : chunks;
+	for (const module of modules) {
+		const { htmlEntries } =
+			/** @type {import("../html/HtmlModule").HtmlModuleBuildInfo} */ (
+				module.buildInfo
+			) || {};
+		if (!htmlEntries) continue;
+		for (const group of Object.values(htmlEntries)) {
+			for (const { entryName } of group) {
+				const entrypoint = compilation.entrypoints.get(entryName);
+				const entryChunk = entrypoint && entrypoint.getEntrypointChunk();
+				if (entryChunk) chunks.push(entryChunk);
+			}
+		}
+	}
+	return chunks;
+};
+
 /**
  * Resolve one `output.html.resourceHints` descriptor to zero or more `<link>`
  * tags. A `chunk`/`entry` reference becomes the emitted chunk URL (a sentinel
@@ -633,6 +675,14 @@ const resolveResourceHint = (desc, ctx) => {
 	} else {
 		return [];
 	}
+	/** @type {Chunk[]} */
+	const hinted = [];
+	for (const chunk of chunks) {
+		for (const resolved of resolvePageChunk(ctx.compilation, chunk)) {
+			hinted.push(resolved);
+		}
+	}
+	chunks = hinted;
 	const kind = desc.as === "style" ? "css" : "javascript";
 	const as = desc.as || (rel === "modulepreload" ? undefined : "script");
 	// A hint targeting another chunk must match how that chunk is fetched, so