webpack/webpack · error · Error

Invalid srcset descriptor found in '${input}' at '${desc}'

Error message

Invalid srcset descriptor found in '${input}' at '${desc}'

What it means

parseSrcset implements the WHATWG srcset attribute parsing algorithm. After tokenizing a candidate's descriptors (width via 'w', density via 'x', height via 'h'), it validates each; if a descriptor is malformed, duplicated (e.g. two widths), zero-width, negative density, or uses an unknown unit, pError is set and the candidate is rejected with this error naming the offending descriptor and the full input.

Source

Thrown at lib/html/syntax.js:9079

				}

				// Anything else, Let error be yes.
			} else {
				pError = true;
			}
		}

		// 15. If error is still no, then append a new image source to candidates whose
		// URL is url, associated with a width width if not absent and a pixel
		// density density if not absent. Otherwise, there is a parse error.
		if (!pError) {
			candidates.push([
				/** @type {string} */ (url),
				start,
				start + /** @type {string} */ (url).length
			]);
		} else {
			throw new Error(
				`Invalid srcset descriptor found in '${input}' at '${desc}'`
			);
		}
	}

	/**
	 * @returns {void}
	 */
	function tokenizeDescriptor() {
		// 8.1. Descriptor tokenizer: Skip whitespace
		collectCharacters(LEADING_SPACES_REGEXP);

		// 8.2. Let current descriptor be the empty string.
		// (Tracked as a start offset, `-1` = empty; sliced once per descriptor.)
		descriptorStart = -1;

		// 8.3. Let state be in descriptor.
		state = "in descriptor";

View on GitHub (pinned to 318421ea8a)

Solutions

  1. Correct the descriptor: use a single width (e.g. img.jpg 480w), a single density (img.jpg 2x), or a single height (img.jpg 600h) per candidate.
  2. Ensure width and density are not both specified on the same candidate.
  3. Validate srcset values in an HTML linter before feeding the file to webpack.

Example fix

<!-- before -->
<img srcset="img.jpg 100w 200w">
<!-- after -->
<img srcset="img.jpg 100w, img.jpg 200w">
Defensive patterns

Strategy: validation

Validate before calling

const DESC = /^\s*\S+(?:\s+(?:\d+[wx]|\d*\.?\d+x|\d+h))?\s*$/;
function validateSrcset(value) {
  return value.split(',').every(c => DESC.test(c));
}

Prevention

When it happens

Trigger: An <img srcset='...'> (or any attribute parsed by parseSrcset) contains a candidate whose descriptor is invalid: e.g. srcset='img.jpg 1y', srcset='img.jpg 100w 200w', srcset='img.jpg 0w', srcset='img.jpg -2x'. Encountered during HTML module build when webpack parses the HTML asset graph.

Common situations: Hand-written srcset with typos; CMS/templates emitting malformed descriptors; confusing the w (width) and x (density) units; mixing the experimental h descriptor with width.

Related errors


AI-assisted analysis of webpack/webpack@318421ea8a (2026-08-03). Data as JSON: /data/errors/3d2ee896cee8cc35.json. Report an issue: GitHub.