# 错误：next.config.js 中的 remotePatterns 配置无效。每个模式都需要 'hostname' 字段。

- **ID:** `nextjs/invalid-image-remote-patterns`
- **领域:** nextjs
- **类别:** config_error
- **验证级别:** ai_generated
- **修复率:** 93%

## 根因

next.config.js 中的 `images.remotePatterns` 数组包含一个没有 `hostname` 字段的对象，该字段是必需的。Next.js 要求每个模式至少有一个 hostname 来匹配远程图像 URL。

## 版本兼容性

| 版本 | 状态 | 引入 | 弃用 |
|------|------|------|------|
| Next.js 13.0.0 | active | — | — |
| Next.js 14.0.0 | active | — | — |
| Next.js 14.2.0 | active | — | — |

## 解决方案

1. ```
   确保 remotePatterns 中的每个对象至少有一个 hostname 字段。示例：`images: { remotePatterns: [{ hostname: 'example.com' }, { hostname: 'cdn.example.com', protocol: 'https' }] }`。
   ```
2. ```
   如果允许所有主机，使用通配符 hostname：`images: { remotePatterns: [{ hostname: '**' }] }`。注意：这在生产环境中不安全，请使用特定的 hostname。
   ```
3. ```
   对于简单情况，使用已弃用的 `domains` 数组代替 remotePatterns：`images: { domains: ['example.com'] }`。注意：domains 在 Next.js 14 中已弃用，但仍然有效。
   ```

## 无效尝试

- **** — The hostname field is still required even if protocol is specified; Next.js will still throw the same error. (100% 失败率)
- **** — While a wildcard hostname is allowed, it must still be explicitly provided as a string; omitting the hostname field entirely will still cause the error. (90% 失败率)
- **** — An empty array will not match any remote images, causing a different error: 'Invalid src prop on next/image, hostname is not configured' for any remote image. (80% 失败率)
