@depup/webpack 5.110.1-depup.0 → 5.110.3-depup.0

package/lib/async-modules/AsyncModuleHelpers.js

@@ -32,16 +32,22 @@ const getOutgoingAsyncModules = (moduleGraph, module) => {
 			const outgoingConnectionMap =
 				moduleGraph.getOutgoingConnectionsByModule(module);
 			if (outgoingConnectionMap) {
-				for (const [module, connections] of outgoingConnectionMap) {
+				// Walk the imports in source order: the spec gathers these from
+				// `[[RequestedModules]]`, and their evaluation order is observable.
+				for (const dependency of module.dependencies) {
+					if (!(dependency instanceof HarmonyImportDependency)) continue;
+					const referenced = moduleGraph.getModule(dependency);
+					if (!referenced || seen.has(referenced)) continue;
+					const connections = outgoingConnectionMap.get(referenced);
 					if (
+						connections &&
 						connections.some(
 							(c) =>
 								c.dependency instanceof HarmonyImportDependency &&
 								c.isTargetActive(undefined)
-						) &&
-						module
+						)
 					) {
-						g(module);
+						g(referenced);
 					}
 				}
 			}

package/lib/config/defaults.js

@@ -179,6 +179,7 @@ const {
  * portableRecords: NonNullable<Optimization["portableRecords"]>,
  * realContentHash: NonNullable<Optimization["realContentHash"]>,
  * minimize: NonNullable<Optimization["minimize"]>,
+ * minimizeOptions: NonNullable<Optimization["minimizeOptions"]>,
  * minimizer: NonNullable<Exclude<Optimization["minimizer"], "...">>,
  * nodeEnv: NonNullable<Optimization["nodeEnv"]>,
  * }} OptimizationNormalizedWithDefaults
@@ -1747,6 +1748,8 @@ const applyOutputDefaults = (
 		"generator",
 		() => tp && optimistic(/** @type {boolean | undefined} */ (tp.generator))
 	);
+	// No `topLevelAwait` here: the option is held back from the patch release,
+	// so nothing derives it from `tp` yet. Reapply by reverting #21881.
 	F(
 		environment,
 		"forOf",
@@ -2463,20 +2466,28 @@ const applyOptimizationDefaults = (
 	D(optimization, "mangleWasmImports", false);
 	D(optimization, "portableRecords", records);
 	D(optimization, "realContentHash", production);
-	F(optimization, "minimize", () => (production ? {} : false));
-	// A plugin can assign the `true` shorthand in `apply()`, which runs after
-	// `getNormalizedOptimizationMinimize` and so never gets normalized. The
-	// normalized type does not allow it, hence the cast.
-	if (/** @type {unknown} */ (optimization.minimize) === true) {
-		optimization.minimize = {};
+	// A plugin assigning the object shorthand in `apply()` runs after
+	// normalization: it replaces `minimizeOptions`, keeping `minimize` boolean.
+	const minimizeAssignedInApply = /** @type {unknown} */ (
+		optimization.minimize
+	);
+	if (typeof minimizeAssignedInApply === "object") {
+		optimization.minimizeOptions = /** @type {OptimizationMinimizeOptions} */ (
+			minimizeAssignedInApply
+		);
+		optimization.minimize = true;
 	}
-	const { minimize } = optimization;
-	if (minimize) {
-		// Canonicalize the object form: the JS minimizer's defaults become
-		// visible in the resolved config rather than hidden in the wiring.
-		F(minimize, "javascript", () => ({ compress: { passes: 2 } }));
-		F(minimize, "css", () => ({}));
-		F(minimize, "html", () => ({}));
+	D(optimization, "minimize", production);
+	F(optimization, "minimizeOptions", () => ({}));
+	const minimizeOptions =
+		/** @type {NonNullable<Optimization["minimizeOptions"]>} */
+		(optimization.minimizeOptions);
+	if (optimization.minimize) {
+		// Canonicalize the per-asset-type options: the JS minimizer's defaults
+		// become visible in the resolved config rather than hidden in the wiring.
+		F(minimizeOptions, "javascript", () => ({ compress: { passes: 2 } }));
+		F(minimizeOptions, "css", () => ({}));
+		F(minimizeOptions, "html", () => ({}));
 	}
 	A(optimization, "minimizer", () => [
 		{
@@ -2501,10 +2512,9 @@ const applyOptimizationDefaults = (
 					compiler
 				);
 
-				// Normalized + defaulted `optimization.minimize` is the per-asset-type
-				// object here: `false` disables a type, an object is its options.
+				// Per asset type: `false` disables that type, an object is its options.
 				const minimizeByType = /** @type {OptimizationMinimizeOptions} */ (
-					compiler.options.optimization.minimize
+					compiler.options.optimization.minimizeOptions
 				);
 				const terserOptions = minimizeByType.javascript || {
 					compress: { passes: 2 }

package/lib/config/normalization.js

@@ -331,7 +331,14 @@ const getNormalizedWebpackOptions = (config) => ({
 					cacheGroups: cloneObject(splitChunks.cacheGroups)
 				}
 		),
-		minimize: getNormalizedOptimizationMinimize(optimization.minimize),
+		// TODO webpack 6: normalize `minimize` to the per-asset-type object and
+		// drop `minimizeOptions` — a breaking change for what plugins read back.
+		minimize:
+			typeof optimization.minimize === "object" ? true : optimization.minimize,
+		minimizeOptions: getNormalizedOptimizationMinimizeOptions(
+			optimization.minimize,
+			optimization.minimizeOptions
+		),
 		minimizer:
 			optimization.minimizer !== undefined
 				? /** @type {OptimizationNormalized["minimizer"]} */ (
@@ -612,15 +619,18 @@ const getNormalizedEntryStatic = (entry) => {
 };
 
 /**
- * Gets normalized optimization minimize: the `true` shorthand becomes an empty
- * per-asset-type object, so downstream only sees `false` or the object form.
+ * Gets the per-asset-type minimize options. `minimize` itself stays a boolean,
+ * and its object form is a shorthand an explicit `minimizeOptions` overrides.
  * @param {Optimization["minimize"]} minimize minimize option
- * @returns {OptimizationNormalized["minimize"]} normalized minimize option
+ * @param {Optimization["minimizeOptions"]} minimizeOptions minimizeOptions option
+ * @returns {OptimizationNormalized["minimizeOptions"]} normalized minimize options
  */
-const getNormalizedOptimizationMinimize = (minimize) => {
-	if (minimize === undefined) return;
-	if (minimize === false) return false;
-	if (minimize === true) return {};
+const getNormalizedOptimizationMinimizeOptions = (
+	minimize,
+	minimizeOptions
+) => {
+	if (minimizeOptions !== undefined) return cloneObject(minimizeOptions);
+	if (typeof minimize !== "object") return;
 	return cloneObject(minimize);
 };
 

package/lib/css/CssLoadingRuntimeModule.js

@@ -76,10 +76,26 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 		} = compilation;
 		const dedupePrefetch = Boolean(resourceHints && resourceHints.dedupe);
 		const fn = RuntimeGlobals.ensureChunkHandlers;
+		/** @type {Set<ChunkId>} */
+		const initialChunkIds = new Set();
+		for (const c of chunk.getAllInitialChunks()) {
+			if (chunkHasCss(c, chunkGraph)) {
+				initialChunkIds.add(/** @type {ChunkId} */ (c.id));
+			}
+		}
 		// The predicate the stylesheet is emitted from: an `@import` external gives a
 		// chunk a css asset without a `CSS_TYPE` module, and it still has to load.
 		const conditionMap = chunkGraph.getChunkConditionMap(chunk, chunkHasCss);
-		const hasCssMatcher = compileBooleanMatcher(conditionMap);
+		// An initial chunk is installed before the handler can run, so it never
+		// reaches the loading path — with no other one there is nothing to load.
+		const loadableConditionMap = { ...conditionMap };
+		for (const id of initialChunkIds) {
+			loadableConditionMap[id] = false;
+		}
+		const hasCssMatcher =
+			compileBooleanMatcher(loadableConditionMap) === false
+				? false
+				: compileBooleanMatcher(conditionMap);
 
 		const withLoading =
 			_runtimeRequirements.has(RuntimeGlobals.ensureChunkHandlers) &&
@@ -88,13 +104,6 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 		const withHmr = _runtimeRequirements.has(
 			RuntimeGlobals.hmrDownloadUpdateHandlers
 		);
-		/** @type {Set<ChunkId>} */
-		const initialChunkIds = new Set();
-		for (const c of chunk.getAllInitialChunks()) {
-			if (chunkHasCss(c, chunkGraph)) {
-				initialChunkIds.add(/** @type {ChunkId} */ (c.id));
-			}
-		}
 
 		if (!withLoading && !withHmr) {
 			return null;
@@ -176,22 +185,32 @@ class CssLoadingRuntimeModule extends RuntimeModule {
 				",\n"
 			)
 		)}\n}`;
+		/**
+		 * @param {string} id expression naming the chunk whose stylesheet is wanted
+		 * @returns {string} expression building its url at runtime
+		 */
+		const runtimeCssUrl = (id) =>
+			`${RuntimeGlobals.publicPath} + ${RuntimeGlobals.getChunkCssFilename}(${id})`;
 		// The url is read through a thunk so a runtime carrying many stylesheets builds
 		// only the one it loads.
 		/**
 		 * @param {string} id expression naming the chunk whose stylesheet is wanted
 		 * @returns {string} expression evaluating to its url
 		 */
-		const cssUrl = (id) =>
-			cssUrls === undefined || cssUrls === null
-				? `${RuntimeGlobals.publicPath} + ${RuntimeGlobals.getChunkCssFilename}(${id})`
-				: `cssUrls[${id}]()`;
+		const cssUrl = (id) => {
+			if (!cssUrls) return runtimeCssUrl(id);
+			// An id the incomplete map lacks still resolves through the runtime lookup,
+			// which the plugin kept required for exactly this case.
+			return cssUrls.complete
+				? `cssUrls[${id}]()`
+				: `(cssUrls[${id}] ? cssUrls[${id}]() : ${runtimeCssUrl(id)})`;
+		};
 		return Template.asString([
 			...(cssUrls
 				? [
 						`${cst} cssUrls = {\n${Template.indent(
 							Array.from(
-								cssUrls,
+								cssUrls.urls,
 								([id, url]) =>
 									`${JSON.stringify(String(id))}: ${runtimeTemplate.returningFunction(url)}`
 							).join(",\n")

package/lib/css/CssModulesPlugin.js

@@ -43,7 +43,7 @@ const {
 	PUBLIC_PATH_AUTO,
 	walkFullHashPlaceholders
 } = require("../util/publicPathPlaceholder");
-const removeBOM = require("../util/removeBOM");
+const { removeBOMFromResult } = require("../util/removeBOM");
 const CssModule = require("./CssModule");
 
 /** @import { Source } from "webpack-sources" */
@@ -516,15 +516,8 @@ class CssModulesPlugin {
 
 					NormalModule.getCompilationHooks(compilation).processResult.tap(
 						PLUGIN_NAME,
-						(result, module) => {
-							if (module.type === type) {
-								const [source, ...rest] = result;
-
-								return [removeBOM(source), ...rest];
-							}
-
-							return result;
-						}
+						(result, module) =>
+							module.type === type ? removeBOMFromResult(result) : result
 					);
 				}
 
@@ -779,13 +772,12 @@ class CssModulesPlugin {
 						// A baked url carries where the stylesheet is, so neither the public
 						// path nor the name lookup is read for it. Asked exactly as the
 						// loading runtime module asks, so the two always agree.
-						if (
-							compilation.runtimeTemplate.analyzableCssChunkUrls(
-								chunk,
-								chunkGraph,
-								set
-							) === null
-						) {
+						const baked = compilation.runtimeTemplate.analyzableCssChunkUrls(
+							chunk,
+							chunkGraph,
+							set
+						);
+						if (baked === null || !baked.complete) {
 							set.add(RuntimeGlobals.publicPath);
 							set.add(RuntimeGlobals.getChunkCssFilename);
 						}

package/lib/css/data.js

@@ -517,7 +517,7 @@ const UNSHARED_LONGHAND_KEYWORDS = new Map([
 // appearing once, in grammar order. A merge emits every value, so the only
 // question is whether each parses back into the longhand it was authored on.
 // prettier-ignore
-const FAMILY_LONGHANDS = new Map([["border-bottom", ["border-bottom-width","border-bottom-style","border-bottom-color"]], ["border-left", ["border-left-width","border-left-style","border-left-color"]], ["border-right", ["border-right-width","border-right-style","border-right-color"]], ["border-top", ["border-top-width","border-top-style","border-top-color"]], ["column-rule", ["column-rule-width","column-rule-style","column-rule-color"]], ["flex-flow", ["flex-direction","flex-wrap"]], ["list-style", ["list-style-type","list-style-position","list-style-image"]], ["outline", ["outline-width","outline-style","outline-color"]], ["text-decoration", ["text-decoration-line","text-decoration-style","text-decoration-color","text-decoration-thickness"]], ["text-emphasis", ["text-emphasis-style","text-emphasis-color"]], ["text-wrap", ["text-wrap-mode","text-wrap-style"]]]);
+const FAMILY_LONGHANDS = new Map([["border-block-end", ["border-block-end-width","border-block-end-style","border-block-end-color"]], ["border-block-start", ["border-block-start-width","border-block-start-style","border-block-start-color"]], ["border-bottom", ["border-bottom-width","border-bottom-style","border-bottom-color"]], ["border-inline-end", ["border-inline-end-width","border-inline-end-style","border-inline-end-color"]], ["border-inline-start", ["border-inline-start-width","border-inline-start-style","border-inline-start-color"]], ["border-left", ["border-left-width","border-left-style","border-left-color"]], ["border-right", ["border-right-width","border-right-style","border-right-color"]], ["border-top", ["border-top-width","border-top-style","border-top-color"]], ["column-rule", ["column-rule-width","column-rule-style","column-rule-color"]], ["flex-flow", ["flex-direction","flex-wrap"]], ["list-style", ["list-style-type","list-style-position","list-style-image"]], ["outline", ["outline-width","outline-style","outline-color"]], ["text-decoration", ["text-decoration-line","text-decoration-style","text-decoration-color","text-decoration-thickness"]], ["text-emphasis", ["text-emphasis-style","text-emphasis-color"]], ["text-wrap", ["text-wrap-mode","text-wrap-style"]]]);
 
 // The properties whose comma-separated items take a `<custom-ident>`, where a
 // vendor spelling is a name the engine parses rather than one it may drop — so a
@@ -537,6 +537,12 @@ const CUSTOM_IDENT_LIST_PROPERTIES = new Set([
 	"will-change"
 ]);
 
+// The shorthands whose grammar juxtaposes its longhands in a fixed order, so a
+// merge writes every value by position rather than reading which slot takes it.
+const ORDERED_LONGHANDS = new Map([
+	["flex", ["flex-grow", "flex-shrink", "flex-basis"]]
+]);
+
 const SLASH_LONGHANDS = new Map([
 	[
 		"grid-area",
@@ -597,7 +603,10 @@ const MERGE_LONGHANDS = new Set([
 	"corner-start-start-shape",
 	"corner-top-left-shape",
 	"corner-top-right-shape",
+	"flex-basis",
 	"flex-direction",
+	"flex-grow",
+	"flex-shrink",
 	"flex-wrap",
 	"grid-column-end",
 	"grid-column-start",
@@ -682,10 +691,10 @@ const OMITTABLE_INITIAL_KEYWORDS = new Map([["grid-auto-flow", ["row", ["column"
 // makes the merge ambiguous, and `FAMILY_SLOT_CLASSES` names a type the printer
 // cannot classify as readily as one it can, so an unknown one declines.
 // prettier-ignore
-const FAMILY_SLOT_KEYWORDS = new Map([["border-bottom-width", ["medium","thick","thin"]], ["border-bottom-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-bottom-color", []], ["border-left-width", ["medium","thick","thin"]], ["border-left-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-left-color", []], ["border-right-width", ["medium","thick","thin"]], ["border-right-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-right-color", []], ["border-top-width", ["medium","thick","thin"]], ["border-top-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-top-color", []], ["column-rule-width", ["medium","thick","thin"]], ["column-rule-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["column-rule-color", []], ["flex-direction", ["column","column-reverse","row","row-reverse"]], ["flex-wrap", ["nowrap","wrap","wrap-reverse"]], ["list-style-type", ["none"]], ["list-style-position", ["inside","outside"]], ["list-style-image", ["none"]], ["outline-width", ["medium","thick","thin"]], ["outline-style", ["auto","dashed","dotted","double","groove","inset","none","outset","ridge","solid"]], ["outline-color", ["auto"]], ["text-decoration-line", ["blink","grammar-error","line-through","none","overline","spelling-error","underline"]], ["text-decoration-style", ["dashed","dotted","double","solid","wavy"]], ["text-decoration-color", []], ["text-decoration-thickness", ["auto","from-font"]], ["text-emphasis-style", ["circle","dot","double-circle","filled","none","open","sesame","triangle"]], ["text-emphasis-color", []], ["text-wrap-mode", ["nowrap","wrap"]], ["text-wrap-style", ["auto","balance","pretty","stable"]]]);
+const FAMILY_SLOT_KEYWORDS = new Map([["border-block-end-width", ["medium","thick","thin"]], ["border-block-end-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-block-end-color", []], ["border-block-start-width", ["medium","thick","thin"]], ["border-block-start-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-block-start-color", []], ["border-bottom-width", ["medium","thick","thin"]], ["border-bottom-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-bottom-color", []], ["border-inline-end-width", ["medium","thick","thin"]], ["border-inline-end-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-inline-end-color", []], ["border-inline-start-width", ["medium","thick","thin"]], ["border-inline-start-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-inline-start-color", []], ["border-left-width", ["medium","thick","thin"]], ["border-left-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-left-color", []], ["border-right-width", ["medium","thick","thin"]], ["border-right-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-right-color", []], ["border-top-width", ["medium","thick","thin"]], ["border-top-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["border-top-color", []], ["column-rule-width", ["medium","thick","thin"]], ["column-rule-style", ["dashed","dotted","double","groove","hidden","inset","none","outset","ridge","solid"]], ["column-rule-color", []], ["flex-direction", ["column","column-reverse","row","row-reverse"]], ["flex-wrap", ["nowrap","wrap","wrap-reverse"]], ["list-style-type", ["none"]], ["list-style-position", ["inside","outside"]], ["list-style-image", ["none"]], ["outline-width", ["medium","thick","thin"]], ["outline-style", ["auto","dashed","dotted","double","groove","inset","none","outset","ridge","solid"]], ["outline-color", ["auto"]], ["text-decoration-line", ["blink","grammar-error","line-through","none","overline","spelling-error","underline"]], ["text-decoration-style", ["dashed","dotted","double","solid","wavy"]], ["text-decoration-color", []], ["text-decoration-thickness", ["auto","from-font"]], ["text-emphasis-style", ["circle","dot","double-circle","filled","none","open","sesame","triangle"]], ["text-emphasis-color", []], ["text-wrap-mode", ["nowrap","wrap"]], ["text-wrap-style", ["auto","balance","pretty","stable"]]]);
 
 // prettier-ignore
-const FAMILY_SLOT_CLASSES = new Map([["border-bottom-width", ["length"]], ["border-bottom-style", []], ["border-bottom-color", ["color"]], ["border-left-width", ["length"]], ["border-left-style", []], ["border-left-color", ["color"]], ["border-right-width", ["length"]], ["border-right-style", []], ["border-right-color", ["color"]], ["border-top-width", ["length"]], ["border-top-style", []], ["border-top-color", ["color"]], ["column-rule-width", ["length"]], ["column-rule-style", []], ["column-rule-color", ["color"]], ["flex-direction", []], ["flex-wrap", []], ["list-style-type", ["custom-ident","string"]], ["list-style-position", []], ["list-style-image", ["image"]], ["outline-width", ["length"]], ["outline-style", []], ["outline-color", ["color"]], ["text-decoration-line", []], ["text-decoration-style", []], ["text-decoration-color", ["color"]], ["text-decoration-thickness", ["length","percentage"]], ["text-emphasis-style", ["string"]], ["text-emphasis-color", ["color"]], ["text-wrap-mode", []], ["text-wrap-style", []]]);
+const FAMILY_SLOT_CLASSES = new Map([["border-block-end-width", ["length"]], ["border-block-end-style", []], ["border-block-end-color", ["color"]], ["border-block-start-width", ["length"]], ["border-block-start-style", []], ["border-block-start-color", ["color"]], ["border-bottom-width", ["length"]], ["border-bottom-style", []], ["border-bottom-color", ["color"]], ["border-inline-end-width", ["length"]], ["border-inline-end-style", []], ["border-inline-end-color", ["color"]], ["border-inline-start-width", ["length"]], ["border-inline-start-style", []], ["border-inline-start-color", ["color"]], ["border-left-width", ["length"]], ["border-left-style", []], ["border-left-color", ["color"]], ["border-right-width", ["length"]], ["border-right-style", []], ["border-right-color", ["color"]], ["border-top-width", ["length"]], ["border-top-style", []], ["border-top-color", ["color"]], ["column-rule-width", ["length"]], ["column-rule-style", []], ["column-rule-color", ["color"]], ["flex-direction", []], ["flex-wrap", []], ["list-style-type", ["custom-ident","string"]], ["list-style-position", []], ["list-style-image", ["image"]], ["outline-width", ["length"]], ["outline-style", []], ["outline-color", ["color"]], ["text-decoration-line", []], ["text-decoration-style", []], ["text-decoration-color", ["color"]], ["text-decoration-thickness", ["length","percentage"]], ["text-emphasis-style", ["string"]], ["text-emphasis-color", ["color"]], ["text-wrap-mode", []], ["text-wrap-style", []]]);
 
 // The identifiers that are a `<color>` on their own — named, system and the two
 // context-dependent ones. Read off the `<color>` grammar outside any function,
@@ -5282,6 +5291,7 @@ module.exports.NTH_NAMED_EQUIVALENTS = NTH_NAMED_EQUIVALENTS;
 module.exports.NTH_PSEUDO_FUNCTIONS = NTH_PSEUDO_FUNCTIONS;
 module.exports.OMITTABLE_INITIAL_KEYWORDS = OMITTABLE_INITIAL_KEYWORDS;
 module.exports.ONE_VALUE_PAIR_SHORTHANDS = ONE_VALUE_PAIR_SHORTHANDS;
+module.exports.ORDERED_LONGHANDS = ORDERED_LONGHANDS;
 module.exports.PAIR_LONGHANDS = PAIR_LONGHANDS;
 module.exports.PLACE_SHORTHANDS = PLACE_SHORTHANDS;
 module.exports.POSITION_PROPERTIES = POSITION_PROPERTIES;

package/lib/css/syntax.js

@@ -88,6 +88,7 @@ const {
 	NTH_PSEUDO_FUNCTIONS,
 	OMITTABLE_INITIAL_KEYWORDS,
 	ONE_VALUE_PAIR_SHORTHANDS,
+	ORDERED_LONGHANDS,
 	PAIR_LONGHANDS,
 	PLACE_SHORTHANDS,
 	POSITION_PROPERTIES,
@@ -5268,8 +5269,13 @@ const _emitTopLevel = (writer, node, offset, line, column, text, own) => {
 	// Folding two named layer blocks into one, and taking back a rule an
 	// identical later one makes dead, each answer to their own option.
 	const minify = printing && _transforms.removeDeadRules;
+	// The node type first: only an at-rule can be a named layer block, and
+	// reading the text asks the rope this node printed to flatten — a copy of
+	// the whole rule, for every rule.
 	const opener =
-		printing && _transforms.mergeRules ? _namedLayerOpener(text) : null;
+		printing && _transforms.mergeRules && _types[_nodeIndex(node)] === T_AT_RULE
+			? _namedLayerOpener(text)
+			: null;
 	// Nothing folds back over a kept comment — it was written above what follows
 	// it — nor over a sibling naming a layer any other way, since it writes into
 	// one of these and the order within a layer is the cascade's.
@@ -9582,15 +9588,31 @@ const _BARE_NUMBER_RE = /^[+-]?(?:\d+\.?\d*|\.\d+)(?:e[+-]?\d+)?$/i;
  * @param {PrintContext} writer the print context (children's printed text)
  * @returns {string[] | null} the fragments to join, or `null` to keep the value as it is
  */
-const _collapseFlexShorthand = (path, node, writer) => {
-	const components = _valueComponents(path, node, writer);
+const _collapseFlexShorthand = (path, node, writer) =>
+	_shortestFlexValue(_valueComponents(path, node, writer));
+
+/**
+ * The shortest spelling of a three-factor `flex` value, or `null` when it is
+ * already the shortest. Shared with the merge, which arrives at the same three
+ * factors from the longhands rather than from an authored shorthand.
+ * @param {string[]} components the value's components, in grammar order
+ * @returns {string[] | null} the fragments to join, or `null` to keep them as they are
+ */
+const _shortestFlexValue = (components) => {
 	if (components.length !== 3) return null;
 	const keyword = FLEX_KEYWORDS.get(components.join(" ").toLowerCase());
 	if (keyword !== undefined) return [keyword];
+	// CSS Flexbox 1 §7.1.1 reads an omitted basis as `0%`, so one spelt that way
+	// says nothing — and an omitted shrink as `1`, so that says nothing either.
+	if (components[2] === "0%") {
+		return components[1] === "1"
+			? [components[0]]
+			: [components[0], components[1]];
+	}
 	// `<'flex-shrink'>` follows the grow factor and defaults to 1, so a `1` there
 	// says nothing — but only over a basis that cannot be read as a factor
-	// itself: CSS Flexbox 1 §7.1.1 reads a unitless zero not preceded by two
-	// factors as a factor, so `1 1 0` is not `1 0`.
+	// itself: §7.1.1 reads a unitless zero not preceded by two factors as a
+	// factor, so `1 1 0` is not `1 0`.
 	return components[1] === "1" && !_BARE_NUMBER_RE.test(components[2])
 		? [components[0], components[2]]
 		: null;
@@ -10655,13 +10677,32 @@ const _mergeBoxLonghands = (
 		// A bare number is no length, so one written beside a length is a value the
 		// property never read — the engine dropped that declaration and kept the
 		// others. Merging them writes it into a shorthand the engine drops whole,
-		// which loses the slots that were fine.
-		if (_mixesBareNumberWithLength(values)) continue;
+		// which loses the slots that were fine. Not asked of an ordered grammar,
+		// whose slots take different types by position (`flex:1 1 0px`).
+		if (mode !== MERGE_ORDERED && _mixesBareNumberWithLength(values)) continue;
 		/** @type {string | null} */
 		let value;
 		if (mode === MERGE_FAMILY) {
 			value = _familyValue(longhands, values);
 			if (value === null) continue;
+		} else if (mode === MERGE_ORDERED) {
+			// The same two refusals every other mode makes: a `var()` may expand
+			// across a slot boundary, and a CSS-wide keyword beside another value is
+			// a shorthand the engine drops whole.
+			let refused = false;
+			for (const slot of values) {
+				if (
+					_hasSubstitution(slot) ||
+					CSS_WIDE_KEYWORDS.has(toLowerCaseIfNeeded(slot))
+				) {
+					refused = true;
+					break;
+				}
+			}
+			if (refused) continue;
+			// Written by position, then shortened the way an authored one would be.
+			const shortest = _shortestFlexValue(values);
+			value = (shortest === null ? values : shortest).join(" ");
 		} else if (mode === MERGE_SLASH) {
 			// The same two refusals a box makes: a `var()` may expand across the `/`
 			// into another slot, and a CSS-wide keyword beside another value is a
@@ -10728,12 +10769,14 @@ const _mergeBoxLonghands = (
 const MERGE_BOX = 0;
 const MERGE_FAMILY = 1;
 const MERGE_SLASH = 2;
+const MERGE_ORDERED = 3;
 
 /** @type {[Map<string, string[]>, number][]} */
 const MERGE_TABLES = [
 	[BOX_LONGHANDS, MERGE_BOX],
 	[PAIR_LONGHANDS, MERGE_BOX],
 	[FAMILY_LONGHANDS, MERGE_FAMILY],
+	[ORDERED_LONGHANDS, MERGE_ORDERED],
 	[SLASH_LONGHANDS, MERGE_SLASH]
 ];
 
@@ -11243,6 +11286,21 @@ const _opensNestedLayer = (text, opener) =>
 // is never dropped as a repeat, wherever in its text it sits.
 const POSITIONAL_AT_RULE_RE = /@(?:charset|import|layer|namespace)\b/i;
 
+/**
+ * Whether a node is an `@layer` at-rule carrying a name — the only shape a
+ * named layer block can have, answered from the node rather than from the text
+ * it printed.
+ * @param {Node} node a block item
+ * @returns {boolean} true for `@layer <name>`
+ */
+const _isNamedLayerAtRule = (node) => {
+	const i = _nodeIndex(node);
+	return (
+		_types[i] === T_AT_RULE &&
+		rangeEqualsLowerCase(_input, _starts[i] + 1, _aux0[i], "layer")
+	);
+};
+
 /**
  * Gather each named `@layer` block into the first sibling block of that name.
  * They are one layer however far apart they stand, and what separates them is in
@@ -11250,16 +11308,26 @@ const POSITIONAL_AT_RULE_RE = /@(?:charset|import|layer|namespace)\b/i;
  * rather than by where they sit, so moving the later body up is not a move the
  * cascade can see. An anonymous `@layer {` is a layer of its own and is left
  * alone (see `ANONYMOUS_LAYER_RE`).
+ * @param {Node[]} items the siblings, in the order their texts stand in
  * @param {string[]} texts the siblings' printed texts, rewritten in place
  * @returns {void}
  */
-const _mergeNamedLayerBlocks = (texts) => {
+const _mergeNamedLayerBlocks = (items, texts) => {
 	if (!_transforms.mergeRules) return;
+	// Which siblings could be one at all, read off the nodes: asking a text
+	// makes the rope that node printed flatten, and this runs for every block.
+	let named = false;
+	for (let i = 0; i < items.length && !named; i++) {
+		named = _isNamedLayerAtRule(items[i]);
+	}
+	if (!named) return;
 	/** @type {Map<string, SeenLayer> | null} */
 	let first = null;
 	for (let i = 0; i < texts.length; i++) {
 		const text = texts[i];
-		const prelude = _namedLayerOpener(text);
+		const prelude = _isNamedLayerAtRule(items[i])
+			? _namedLayerOpener(text)
+			: null;
 		if (prelude === null) {
 			// A sibling naming a layer any other way writes into one of these, and
 			// the order within a layer is the cascade's, so nothing folds over it.
@@ -11754,7 +11822,7 @@ const _composeBlockBody = (path, decls, rules, writer, minify, nl, owner) => {
 				? null
 				: new Set(childScope.pending.values())
 		);
-		_mergeNamedLayerBlocks(texts);
+		_mergeNamedLayerBlocks(items, texts);
 	}
 	// Only the last of a set of declarations of one property can be read, so
 	// the earlier ones carry nothing — whatever stands between them. Identical

package/lib/dependencies/CommonJsRequireDependency.js

@@ -20,6 +20,7 @@ const HarmonyImportGuard = require("./HarmonyImportGuard");
 const ModuleDependency = require("./ModuleDependency");
 
 /** @import { ReplaceSource } from "webpack-sources" */
+/** @import ConcatenationScope from "../ConcatenationScope" */
 /**
  * @import {
  * 	GetConditionFn,
@@ -30,6 +31,7 @@ const ModuleDependency = require("./ModuleDependency");
 /** @import { DependencyTemplateContext } from "../DependencyTemplate" */
 /** @import Module from "../Module" */
 /** @import ModuleGraph from "../ModuleGraph" */
+/** @import ModuleGraphConnection from "../ModuleGraphConnection" */
 /** @import { Range } from "../javascript/JavascriptParser" */
 /** @import { UsedByExports } from "../optimize/InnerGraph" */
 /** @import { RuntimeSpec } from "../util/runtime" */
@@ -200,6 +202,19 @@ class CommonJsRequireDependency extends ModuleDependency {
 		return concatenateCommonJsModules && this._canConcatenate;
 	}
 
+	/**
+	 * @param {ModuleGraphConnection} connection the active connection of this dependency
+	 * @param {ConcatenationScope} concatenationScope the concatenation scope
+	 * @returns {boolean} true when the call becomes a module reference
+	 */
+	rendersAsConcatenatedReference(connection, concatenationScope) {
+		return (
+			this._canConcatenate &&
+			this.valueRange !== undefined &&
+			concatenationScope.isModuleInScope(connection.module)
+		);
+	}
+
 	/**
 	 * Serializes this instance into the provided serializer context.
 	 * @param {ObjectSerializerContext} context context
@@ -278,9 +293,9 @@ CommonJsRequireDependency.Template = class CommonJsRequireDependencyTemplate ext
 		if (
 			connection &&
 			concatenationScope !== undefined &&
-			dep.valueRange !== undefined &&
-			concatenationScope.isModuleInScope(connection.module)
+			dep.rendersAsConcatenatedReference(connection, concatenationScope)
 		) {
+			const valueRange = /** @type {Range} */ (dep.valueRange);
 			let content = concatenationScope.createModuleReference(
 				connection.module,
 				{
@@ -300,8 +315,7 @@ CommonJsRequireDependency.Template = class CommonJsRequireDependencyTemplate ext
 				);
 				content = `${RuntimeGlobals.constructRequire}(${content})`;
 			}
-			source.replace(dep.valueRange[0], dep.valueRange[1] - 1, content);
-			concatenationScope.registerReplacedRequire(dep.valueRange);
+			source.replace(valueRange[0], valueRange[1] - 1, content);
 			return;
 		}
 		const importedModule = /** @type {Module} */ (moduleGraph.getModule(dep));

package/lib/dependencies/ContextDependencyTemplateAsRequireCall.js

@@ -22,11 +22,9 @@ class ContextDependencyTemplateAsRequireCall
 	 * @param {DependencyTemplateContext} templateContext the context object
 	 * @returns {void}
 	 */
-	apply(
-		dependency,
-		source,
-		{ runtimeTemplate, moduleGraph, chunkGraph, runtimeRequirements }
-	) {
+	apply(dependency, source, templateContext) {
+		const { runtimeTemplate, moduleGraph, chunkGraph, runtimeRequirements } =
+			templateContext;
 		const dep = /** @type {ContextDependency} */ (dependency);
 		let moduleExports = runtimeTemplate.moduleExports({
 			module: moduleGraph.getModule(dep),
@@ -49,8 +47,7 @@ class ContextDependencyTemplateAsRequireCall
 						source.replace(rep.range[0], rep.range[1] - 1, rep.value);
 					}
 				}
-				source.replace(dep.valueRange[1], range[1] - 1, ")");
-				source.replace(range[0], dep.valueRange[0] - 1, `${moduleExports}(`);
+				this.replaceCall(dep, source, moduleExports, templateContext);
 			} else {
 				source.replace(range[0], range[1] - 1, moduleExports);
 			}
@@ -58,6 +55,22 @@ class ContextDependencyTemplateAsRequireCall
 			source.replace(range[0], range[1] - 1, moduleExports);
 		}
 	}
+
+	/**
+	 * Rewrites the call around its request, dropping anything the original one
+	 * carried after it. Overridden where a later argument must be kept.
+	 * @param {ContextDependency} dep the dependency
+	 * @param {ReplaceSource} source the current replace source which can be modified
+	 * @param {string} moduleExports the expression the request is passed to
+	 * @param {DependencyTemplateContext} templateContext the context object
+	 * @returns {void}
+	 */
+	replaceCall(dep, source, moduleExports, templateContext) {
+		const range = /** @type {Range} */ (dep.range);
+		const valueRange = /** @type {Range} */ (dep.valueRange);
+		source.replace(valueRange[1], range[1] - 1, ")");
+		source.replace(range[0], valueRange[0] - 1, `${moduleExports}(`);
+	}
 }
 
 module.exports = ContextDependencyTemplateAsRequireCall;

package/lib/dependencies/HarmonyEvaluatedImportSpecifierDependency.js

@@ -150,10 +150,16 @@ HarmonyEvaluatedImportSpecifierDependency.Template = class HarmonyEvaluatedImpor
 				break;
 			}
 			case "namespace": {
-				value =
-					ids[0] === "__esModule"
-						? ids.length === 1 || undefined
-						: exportsInfo.isExportProvided(ids);
+				// Empty ids are an `export * as ns` hop skipped as side-effect free,
+				// leaving the target's own namespace, which always exists.
+				if (ids.length === 0) {
+					value = true;
+				} else {
+					value =
+						ids[0] === "__esModule"
+							? ids.length === 1 || undefined
+							: exportsInfo.isExportProvided(ids);
+				}
 				break;
 			}
 			case "dynamic": {