CODEWITHSUNDEEP
reactjsdeploymentreact-router-domgithub-pagespublic
Nosaj Chan
Nosaj Chan

Reputation: 21

Deploying react project to github pages face problem for image in public folder

I have encountered trouble in deploying my react js project on Github.

In short, the javascript in HTML file is working well, but all the images and PDF file I put in the public folder seems unread by the server. Those images and PDF file existed in the BUILD folder but just can't show on the page. The error message for each image in the console is:

[ Failed to load resource: the server responded with a status of 404 () ]

What is the problem you guys suspect that it may be? Is it because I directly quote those images with <img src="/barbell.svg"> so after deploy they can't match the image file name?

Image and PDF in BUILD folder

Github page and error message in the console

Upvotes: 2

Views: 1489

Answers (1)

tannguyen1905
tannguyen1905

Reputation: 21

Try using <img src={process.env.PUBLIC_URL + "/barbell.svg"}> if your images are in a public folder.

Upvotes: 2

Related Questions