gatsbyjs/gatsby · error · Error

No width or height is given to resize "${source.url}"

Error message

No width or height is given to resize "${source.url}"

What it means

Thrown by the resize resolver when neither args.width nor args.height is provided for a resize operation. At least one dimension is mandatory for the image service to compute the output size.

Source

Thrown at packages/gatsby-plugin-utils/src/polyfill-remote-file/graphql/resize-resolver.ts:69

    return null
  }

  if (!args.format) {
    args.format = `auto`
  }

  if (!args.quality) {
    args.quality = DEFAULT_QUALITY
  }

  if (!allowedFormats.includes(args.format)) {
    throw new Error(
      `Unknown format "${args.format}" was given to resize ${source.url}`
    )
  }

  if (!args.width && !args.height) {
    throw new Error(`No width or height is given to resize "${source.url}"`)
  }

  const formats = validateAndNormalizeFormats(
    [args.format],
    getImageFormatFromMimeType(source.mimeType)
  )
  const [format] = formats
  const { width, height } = calculateImageDimensions(
    source,
    args as IResizeArgs & WidthOrHeight
  )

  if (shouldDispatchLocalImageServiceJob()) {
    dispatchLocalImageServiceJob(
      {
        url: source.url,
        mimeType: source.mimeType,
        filename: source.filename,

View on GitHub (pinned to 8b06340921)

Solutions

  1. Provide at least width or height in the resize arguments.
  2. If using a fixed layout, pass width; for responsive, ensure the schema provides dimensions.
  3. Check that the GraphQL field definition for resize enforces at least one dimension argument.

Example fix

// before
resizeImage(source, { format: 'webp' })
// after
resizeImage(source, { format: 'webp', width: 400 })
Defensive patterns

Strategy: validation

Validate before calling

// Ensure at least one dimension for resize
if (!args.width && !args.height) {
  throw new Error('At least width or height is required for resize')
}

Type guard

const hasResizeDimension = (args: unknown): args is { width?: number; height?: number } =>
  typeof args === 'object' && args !== null &&
  ((args as any).width > 0 || (args as any).height > 0)

Prevention

When it happens

Trigger: Both args.width and args.height are falsy after format/quality defaults are applied; the resize cannot proceed without a target dimension.

Common situations: A GraphQL query calls the resize field with only format/quality but omits dimensions, or a programmatic call forgets to pass width/height.

Related errors


AI-assisted analysis of gatsbyjs/gatsby@8b06340921 (2026-08-13). Data as JSON: /api/errors/72f5383805786f1f. Report an issue: GitHub.