0

I am currently having trouble rendering an image from a local file. I have tried these options

<Image src={require(this.state.image)} className="image" roundedCircle/>
Import testImage from “../image.png”

I have looked at other StackOverflow posts, and most of them use the first method with the require. However, require does not work for me. The import statement does in fact work for me, but I am trying to dynamically render an image. I have also put the image in the css using the url() function, but I don’t think that will be dynamic.

Are there any other options that I could go for? Also, if anyone knows how to get require to work, that would be great.

ENDGAMEPROPHECY
  • 25
  • 3
  • Are you running some other kind of server in parrallel with React's (like a backend or something)? You could easily do this via `fetch` with the external server, provided that it can transfer files. – Countour-Integral Jan 14 '21 at 20:57
  • Make sure your image file exists. Maybe you can check this -> https://stackoverflow.com/questions/37644265/correct-path-for-img-on-react-js/49785719#49785719 – Prince Sodhi Jan 14 '21 at 20:57
  • @Countour-Integral I am using the MERN stack. – ENDGAMEPROPHECY Jan 14 '21 at 22:09

0 Answers0