nextjs config_error ai_generated true

错误：next/image 上的 width 属性无效。宽度必须为正数且小于或等于图像的原始宽度（1920）。

Error: Invalid width attribute on next/image. The width must be a positive number less than or equal to the image's intrinsic width (1920).

ID: nextjs/invalid-image-width-attribute

其他格式: JSON · Markdown 中文 · English
92%修复率
87%置信度
1证据数
2024-04-20首次发现

版本兼容性

版本状态引入弃用备注
13.5.0 active — — —
14.2.0 active — — —
15.0.0 active — — —

根因分析

next/image 组件的 width 属性设置为大于图像原始宽度的值，或为零/负数。Next.js 强制要求 width 不能超过原始图像尺寸，以防止未经明确配置的放大。

English

The next/image component's width prop is set to a value greater than the image's intrinsic width, or is zero/negative. Next.js enforces that width cannot exceed the original image dimensions to prevent upscaling without explicit configuration.

generic

官方文档

https://nextjs.org/docs/app/api-reference/components/image#width

解决方案

  1. Set the width prop to the image's actual intrinsic width or smaller. Use the fill prop with sizes if you need to stretch beyond intrinsic dimensions.
  2. Use the unoptimized prop to bypass Next.js image optimization, which also relaxes dimension validation.

无效尝试

常见但无效的做法:

  1. Setting width to a very large number like 9999 to avoid responsive issues 90% 失败

    Next.js validates width against the actual image dimensions. Using a value larger than intrinsic width triggers this error.

  2. Omitting width and height props entirely 80% 失败

    next/image requires either width/height or fill prop. Omitting them results in a different error about missing dimensions.

  3. Using CSS to override the width after setting it incorrectly 85% 失败

    The validation happens at build/render time before CSS is applied. CSS overrides don't prevent the error.