【发布时间】:2017-01-15 15:52:54
【问题描述】:
我设置了 ReactJS 和 Webpack。我正确设置了 src 路径,但仍然出现以下错误,我似乎无法弄清楚原因。尝试了所有,例如 ./、/、../ 等。图像称为 practiceImage.jpg,它位于我的公共文件夹内的媒体文件夹中。
为什么找不到?正确的路径应该是什么?
在我的页面文件夹中的home-page.js 中:
<div>
<img src="../../public/media/practiceImage.jpg"
style={{width: '100%', height: '100%'}}
/>
</div>
但没有渲染,我在浏览器上看到损坏的图像和错误GET http://localhost:8080/public/media/practiceImage.jpg 404 (Not Found)
是我的目录树:
【问题讨论】:
-
如果
public是根文件夹,则相对于根目录使用:<img src="/media/practiceImage.jpg" />。 -
@skobaljic 你如何确定某个东西是否是根文件夹以查看是否相对?
-
应用程序通常将一个文件夹设置为公共文件夹,将文件夹结构中的其他文件路径作为样式表与您在服务器上看到的进行比较。例如,如果您的 css 在
public/css/style.css中,但在服务器上是css/style.css,那么您的公用文件夹是public并将其视为服务器根目录。 -
@skobaljic 请看一下原帖中目录树的图像。我的
public文件夹确实包含样式表。所以public文件夹有这两个路径:public -> stylesheets -> base.scss和public -> media -> practiceImage.jpg。基于此,我应该尝试什么?
标签: javascript css node.js reactjs webpack