Skip to content
Advertisement

Unable to load certain images after Build in ReactJS (served with github)

I am trying to launch my website on github. After running npm run build, everything loads as expected when calling serve -s build. However when hosted on github, see website, I am unable to load the portfolio images. Strangely, I am able to access the files associated with each project.

Here is my ReactJS:

JavaScript

and the json:

JavaScript

The files and images are stored in the public folder.

A few things I have tried:

  • Different browsers
  • Removing subfolders to root of public folder.
  • Trying folder traversing like ../images/myImage.png etc.
  • Trying src={require(projects.image).default}.

Any suggestions much appreciated – I am impatient to get it up and running!

Advertisement

Answer

the problem is in path it’s supposed to be .PNG capital i saw your image in github repo it’s .PNG not .png

you have to change .PNG in github repo to be .png

enter image description here

User contributions licensed under: CC BY-SA
3 People found this is helpful
Advertisement