Next.js Image组件提示域名未配置但已添加到next.config.js问题求助

• 核心原因是next.config.js的修改未被服务端加载：Next.js的配置文件修改不会触发热重载，必须完全重启开发服务器才会生效，你新增域名配置后没有重启服务，服务端运行时一直读的是旧的配置。
• 本地缓存干扰：之前加载过的Storyblok图片已经被Next.js图片优化服务缓存，不会触发域名校验，新增的未缓存图片触发校验时就会报错。
• 你测试的临时生效逻辑是客户端热更新时绕过了服务端配置校验：取消注释组件的热更新操作是客户端侧渲染，没有走服务端的配置校验逻辑，所以图片暂时正常，刷新页面会触发服务端渲染，读旧配置就会重新报错。
• 若你使用的是Next.js 13及以上版本，旧的domains配置已经被废弃，App Router场景下不会生效。
• 项目下存在多份Next.js配置文件，导致你修改的配置没有被实际加载。

1. 首先完全停止当前运行的开发服务，重新执行启动命令（npm run dev/yarn dev/pnpm dev），重启后配置会被重新加载，绝大多数情况下该问题会直接解决。
2. 如果你使用的是Next.js 13+版本，将配置替换为官方推荐的remotePatterns写法：

module.exports = {
  images: {
    remotePatterns: [
      {
        protocol: 'https',
        hostname: 'a.storyblok.com',
        pathname: '/f/**',
      },
    ],
  },
  experimental: { esmExternals: true },
};

修改完成后同样需要重启开发服务。
3. 检查项目根目录，删除多余的配置文件，确保仅保留一份生效的next.config.js/next.config.mjs配置文件。
4. 如果是生产环境出现该问题，修改配置后重新执行构建命令再部署即可。

内容的提问来源于stack exchange，提问作者Darkbound