Images not showing but works locally

[Otilia]

Hello!

My site is https://steady-stardust-e5352b.netlify.app/

The pictures are not showing, even though locally they work. My GitHub repository is this https://github.com/0tilia/digital-business-card/tree/main

I tried searching for an answer, but I didn’t manage to solve this issue on my own. I am a beginner at programming.

[clarnx]

Hi @Otilia , thanks for the post and welcome.
Kindly check the forum link below and follow the suggestion there as the problem is similar to yours.

React app created with vite works fine locally but when deployed on netfliy, images not showing up.. here's the solution

PLEASE help us help you by writing a good post! Site name - https://thriving-panda-53d2c9.netlify.app App works fine locally with images showing properly Solution - Anyone facing similar issues, please move images from src folder to public folder and give path to images without mentioning public in relative path… for eg. once images folder moved to public folder relative path should be img src= '/images/abc.png and that should resolve the issue. Thanks, Polaris430

Let me know the outcome.

Thanks.

[nathanmartin]

@Otilia The answer has already been given by @clarnx, but you can also check the relevant Vite documentation:

See:
Vite - Static Asset Handling
Vite - The public Directory

For future debugging also make sure to run your build command locally when trying to pinpoint what is occuring.

The develop command doesn’t perform the same thing and thus it’s fairly easy to end up in a situation where it appears to “work locally” but “doesn’t work on Netlify”, but it’s really just the difference between what develop is doing and what build does.

In this situation if you run your build command and then serve the output directly with npx serve you’ll find that it displays the same thing as on Netlify.