Can't load images from local files in React, React is trying to pull image from proxy?

I am currently building a small react webpage and the component I’m building returns one of two images based on whether a certain variable is null or not (it is supposed to hold the link to an image after an api request is made, but starts null). When that link isn’t available the code is supposed to return a different img object with an image locally available "camera.jpg".

Unfortunately it looks like react is trying to call the proxy to my backend for the image even though I define the image with a local path. Any advice on how to fix it?

For reference here are my files

Here is the warning telling me that react is looking in proxy for the image

Img html object in code

<img
        id="imgHolder"
        src="./camera.jpg"
        alt="Something went wrong!"
        height="500"
        width="500"
      />

I have tried to look at different sources but I can’t tell if this is a problem with my js code or if I lack an understanding of how the proxy value functions in package.json. I want to see the image pop up but what I get instead is the alt text.

You need to sign in to view this answers