英文:
Why are my React images not loading in the web browser?
问题
我的React应用程序中的图像无法在浏览器中渲染。图像文件夹位于src而不是public中。我应该如何在我的React项目中加载这些图像？以下是我的当前图像路径：
<a href="/" className="logo">
<img src="../src/comp/images/logo.png" alt="logo" />
</a>
英文:
My React app’s images are not rendering in the browser. The images folder is in src rather than public. How can I load the images in my React project? Here is my current image pathing:
<a href="/" className="logo">
<img src="../src/comp/images/logo.png" alt="logo" />
</a>
答案1
得分: 1
../src/comp/images/logo.png 可能不是 Web 服务器上可用或合理的路径。如果您正在使用 Vite，这就是公共文件夹的用途。放置在公共文件夹中的资产可以静态提供给 Web 服务器。
如果您无法使用公共文件夹，请尝试以下方法：
import Logo from '../src/comp/images/logo.png';
<a href="/" className="logo">
<img src={Logo} alt="logo" />
</a>
英文:
It's likely that ../src/comp/images/logo.png is not a path that's available or makes sense to the webserver. If you're using vite, this is the purpose of the public folder. Assets that are placed into the public folder are made statically available to the webserver.
If you can't use the public folder, try this:
import Logo from '../src/comp/images/logo.png';
<a href="/" className="logo">
<img src={Logo} alt="logo" />
</a>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论