How to show image from json file in local host? [duplicate]

Question

How can I show images from json file in localhost in React Application? I'm tryig this below one but it is not working.

json file:

{
  "img":"images/img-filename.png"
}

image is located at src/images/img-filename.png

In React app, image path is displaying: images/img-filename.png

Possible duplicate of Load local images in React.js as @PPetkov mentions — Ted
– Ted, Commented May 14, 2019 at 15:03

Engineer · Accepted Answer · 2019-05-14 14:54:05Z

0

Images from src folder can be displayed in React component by:-

<img height="32" src="../images/img-filename.png" />

../ is to go one folder out. I hope it helps.

answered May 14, 2019 at 14:54

Engineer

1,26111 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

I did that, still not showing... file path is coming from .json file. Path is displaying as mentioned in .json but image is still not displaying

@Ali when you render img object, also add ../ in src

json path: { "img" : "../images/img-filename.png" } React file: <img src={data.img} .../>

It is showing images, after I moved the images folder to the public folder.