CODEWITHSUNDEEP
htmlreactjs
sakirow
sakirow

Reputation: 229

How to use img tag in react

I am trying to show my local image into html using react.

Here is my project structure

I have app.js which is calling Header component.

App.js

I am trying to add woods.jpg

Header.js

The image does not exist, why?

html page and error

I tried different location but couldn't implement it, 

src={"../w3images/woods.jpg"}
src={"./w3images/woods.jpg"}
src={"/w3images/woods.jpg"}
src="/w3images/woods.jpg"

Upvotes: 0

Views: 7836

Answers (2)

ChrisR
ChrisR

Reputation: 4008

I guess your app is served from public (there's a folder I see).

Then you must specify a path relative to that folder.

Something like ../src/w3images/woods.jpg if your index.html is in /public/index.html.

Upvotes: 0

benjamin Rampon
benjamin Rampon

Reputation: 1416

Your images must be on the public repository to be accessed.

Then, you can have an img like that :

<img src="/w3images/woods.jpg"/>

Upvotes: 3

Related Questions