nextjs
config_error
ai_generated
true
错误:`next/image` 的 src 属性无效,远程图像不支持相对路径
Error: Invalid src prop on `next/image`, relative paths are not supported for remote images
ID: nextjs/next-image-src-relative-path
95%修复率
88%置信度
1证据数
2023-11-01首次发现
版本兼容性
| 版本 | 状态 | 引入 | 弃用 | 备注 |
|---|---|---|---|---|
| [email protected] | active | — | — | — |
| [email protected] | active | — | — | — |
| [email protected] | active | — | — | — |
根因分析
next/image 组件要求远程图像使用绝对 URL。提供相对路径(例如 '/images/photo.jpg')而没有配置 remotePatterns 或 loader 会导致此错误,因为 Next.js 无法解析优化所需的基 URL。
English
The next/image component requires absolute URLs for remote images. Providing a relative path (e.g., '/images/photo.jpg') without a configured remotePatterns or loader causes this error, as Next.js cannot resolve the base URL for optimization.
官方文档
https://nextjs.org/docs/app/api-reference/components/image#remotepatterns解决方案
-
通过环境变量或请求主机构造绝对 URL。
-
在 next.config.js 中配置 remotePatterns,并使用匹配模式的相对路径。
无效尝试
常见但无效的做法:
-
80% 失败
This still resolves to a relative path on the server, not an absolute URL; the error persists.
-
90% 失败
This disables optimization but doesn't fix the path resolution; the error still occurs.