reactjs 如何在react应用程序中从src文件夹获取图像路径

c86crjj0  于 2023-06-29  发布在  React
关注(0)|答案(2)|浏览(249)

我在src/components/assets/media/images文件夹中添加了一些图像,但当我部署到Vercel应用程序时,我看不到这些文件已部署。它仍然显示旧的文件集。

这些图像/png文件在github中,部署是从同一个位置发生的,但我检查了它在部署中没有。
我不明白如何将这些徽标的路径包含在monngodb中可用的外部json中
我在想,也许这些文件从未在应用程序中使用过,这就是它们出现在asset_manifest. json中的原因。
现有文件在扩展名前附加了一个散列。

epfja78i

epfja78i1#

您的图像不在正确的文件夹中或路径错误。Vercel希望您的静态资源位于项目根目录下一个名为public的文件夹中,您应该在路径的开头使用斜杠(/)引用它们。(ex)如果在public/images文件夹中有一个名为logo.png的图像,则应使用

<img src="/images/logo.png" />

在你的代码中。请确保您的图像位于公用文件夹中,而不是位于

src/components/assets/media/images.
lmyy7pcs

lmyy7pcs2#

是否在部署之前生成了项目:

npm run build

如果是,请在部署后尝试硬刷新。旧图像可能会被缓存。
在使用Google Chrome的Mac上....打开检查器,然后按住控制键,然后单击重新加载按钮,然后选择“硬刷新”。或者按Control + Command + R
如果你想要一个按钮来测试,
尝试以下操作:

window.location.reload(true);

如果你使用的是Typescript,并得到一个错误,在它之前添加以下内容:

//@ts-ignore
window.location.reload(true);

你需要真实。没有它,它只是一个刷新。浏览器不会从服务器重新加载该高速缓存。

相关问题