{"record":{"id":"c1bad25c024f17cb","repo":"withastro/astro","slug":"missingimagedimension","errorCode":"MissingImageDimension","errorMessage":"Missing ${missingDimension === 'both' ? 'width and height attributes' : `${missingDimension} attribute`} for ${imageURL}. When using remote images, both dimensions are required in order to avoid CLS.","messagePattern":"Missing (.+?) attribute`\\} for (.+?)\\. When using remote images, both dimensions are required in order to avoid CLS\\.","errorType":"exception","errorClass":"AstroError","httpStatus":null,"severity":"error","filePath":"packages/astro/src/assets/services/service.ts","lineNumber":181,"sourceCode":"\t\t) {\n\t\t\tthrow new AstroError({\n\t\t\t\t...AstroErrorData.LocalImageUsedWrongly,\n\t\t\t\tmessage: AstroErrorData.LocalImageUsedWrongly.message(options.src),\n\t\t\t});\n\t\t}\n\n\t\t// For remote images, width and height are explicitly required as we can't infer them from the file\n\t\tlet missingDimension: 'width' | 'height' | 'both' | undefined;\n\t\tif (!options.width && !options.height) {\n\t\t\tmissingDimension = 'both';\n\t\t} else if (!options.width && options.height) {\n\t\t\tmissingDimension = 'width';\n\t\t} else if (options.width && !options.height) {\n\t\t\tmissingDimension = 'height';\n\t\t}\n\n\t\tif (missingDimension) {\n\t\t\tthrow new AstroError({\n\t\t\t\t...AstroErrorData.MissingImageDimension,\n\t\t\t\tmessage: AstroErrorData.MissingImageDimension.message(missingDimension, options.src),\n\t\t\t});\n\t\t}\n\t} else {\n\t\tif (!VALID_SUPPORTED_FORMATS.includes(options.src.format as any)) {\n\t\t\tthrow new AstroError({\n\t\t\t\t...AstroErrorData.UnsupportedImageFormat,\n\t\t\t\tmessage: AstroErrorData.UnsupportedImageFormat.message(\n\t\t\t\t\toptions.src.format,\n\t\t\t\t\toptions.src.src,\n\t\t\t\t\tVALID_SUPPORTED_FORMATS,\n\t\t\t\t),\n\t\t\t});\n\t\t}\n\n\t\tif (options.widths && options.densities) {\n\t\t\tthrow new AstroError(AstroErrorData.IncompatibleDescriptorOptions);","sourceCodeStart":163,"sourceCodeEnd":199,"githubUrl":"https://github.com/withastro/astro/blob/d081033d5fe8e8a68c4bbbad4af9d2deb9c74bca/packages/astro/src/assets/services/service.ts#L163-L199","documentation":"Thrown by verifyOptions() for remote (non-imported) images when width and/or height are missing. Because the service cannot infer dimensions from a remote file without a fetch, both width and height are mandatory for remote string sources to avoid layout shift (CLS).","triggerScenarios":"Calling the service with a remote string src where neither width nor height is set (missingDimension='both'), only height is set ('width'), or only width is set ('height'). The message names which dimension(s) are missing and the imageURL.","commonSituations":"Author uses <Image src='https://cdn/x.png' /> without dimensions, or sets only width. Common when migrating from <img> or copying remote URLs into components.","solutions":["Provide both width and height for remote images.","Use inferSize: true on getImage (and let Astro probe), where supported, to auto-derive dimensions.","If using <Image > with a known aspect ratio, compute height from width.","For full-bleed images, set explicit width and height in the attributes."],"exampleFix":"// before\n<Image src='https://cdn.example.com/photo.jpg' alt='photo' />\n\n// after\n<Image src='https://cdn.example.com/photo.jpg' width={1200} height={800} alt='photo' />","handlingStrategy":"validation","validationCode":"function hasBothDimensions(o: { width?: number; height?: number }): boolean {\n  return Number.isFinite(o.width) && Number.isFinite(o.height);\n}","typeGuard":"function hasDimensions(o: unknown): o is { width: number; height: number } {\n  return typeof o === 'object' && o !== null\n    && Number.isFinite((o as any).width) && Number.isFinite((o as any).height);\n}","tryCatchPattern":null,"preventionTips":["Always set width and height for remote images.","Use inferSize where supported to auto-derive dimensions.","Keep an aspect-ratio map for known remote sources."],"tags":["images","remote","validation","cls"],"backgroundTag":null,"analyzedSha":"d081033d5fe8e8a68c4bbbad4af9d2deb9c74bca","analyzedAt":"2026-08-12T13:37:29.035Z","schemaVersion":2},"datasetVersion":"2026-08-12T18:17:37.767Z"}