vercel/next.js · error · Error

Image with src "${src}" has invalid "loading" property. Prov

Error message

Image with src "${src}" has invalid "loading" property. Provided "${loading}" should be one of ${VALID_LOADING_VALUES.map(String).join(',')}.

What it means

Props validation in getImgProps: the loading prop is not one of the accepted values (lazy/eager). An unrecognized loading value would produce invalid HTML attributes and break browser loading hints, so the allowed list is echoed in the error.

Source

Thrown at packages/next/src/shared/lib/get-img-props.ts:541

            `Image with src "${src}" has invalid "height" property. Expected a numeric value in pixels but received "${height}".`
          )
        }
        // eslint-disable-next-line no-control-regex
        if (/^[\x00-\x20]/.test(src)) {
          throw new Error(
            `Image with src "${src}" cannot start with a space or control character. Use src.trimStart() to remove it or encodeURIComponent(src) to keep it.`
          )
        }
        // eslint-disable-next-line no-control-regex
        if (/[\x00-\x20]$/.test(src)) {
          throw new Error(
            `Image with src "${src}" cannot end with a space or control character. Use src.trimEnd() to remove it or encodeURIComponent(src) to keep it.`
          )
        }
      }
    }
    if (!VALID_LOADING_VALUES.includes(loading)) {
      throw new Error(
        `Image with src "${src}" has invalid "loading" property. Provided "${loading}" should be one of ${VALID_LOADING_VALUES.map(
          String
        ).join(',')}.`
      )
    }
    if (priority && loading === 'lazy') {
      throw new Error(
        `Image with src "${src}" has both "priority" and "loading='lazy'" properties. Only one should be used.`
      )
    }
    if (preload && loading === 'lazy') {
      throw new Error(
        `Image with src "${src}" has both "preload" and "loading='lazy'" properties. Only one should be used.`
      )
    }
    if (preload && priority) {
      throw new Error(
        `Image with src "${src}" has both "preload" and "priority" properties. Only "preload" should be used.`

View on GitHub (pinned to 0eb3775416)

Solutions

1. Set loading to one of the valid values (e.g. "lazy" or "eager").

When it happens

Trigger: next/image loading prop is not a valid value.

Common situations: Passing a value other than 'lazy' or 'eager' as the loading prop.

AI-assisted analysis of vercel/next.js@0eb3775416 (2026-08-19). Data as JSON: /api/errors/3a184f35c7b389a6. Report an issue: GitHub.