在 nextjs 上的 vercel 中部署后图像未加载答案

【问题标题】：Images not loading after deploy in vercel on nextjs在 nextjs 上的 vercel 中部署后图像未加载
【发布时间】：2022-08-21 07:56:40
【问题描述】：

我是下一个 js 的新手。我最近将我的项目部署到 vercel。一切正常。但图像出现错误，如下所示

加载资源失败：服务器响应状态为 502 ()

同时我使用了导入图像。部署后工作正常

在 localhost 上一切正常，但是当我在 Vercel 中部署我的网站时，图像无法正确加载。

检查部署的站点：https://shafeeque.ml

图片如下 <Image width={330} height={220} className=\'object-fill w-44\' src={key.image} alt={key.name}></Image>

导入图像如下（部署后工作）

import Cover from \'../public/cover.jpg\'
<Image  className=\'object-fill w-44\' src={Image} alt={key.name}></Image>

有人可以帮助我吗？

【解决方案1】：

我也遇到了这个问题，并通过删除 ../public 并仅使用图像的路径来修复它，就好像我已经在公用文件夹中进行操作一样。

将 key.image 的值更改为“/cover.jpg”

<Image  className='object-fill w-44' src={key.image} alt={key.name}></Image>

【讨论】：