Assets returning 404 not found

Support
, ,
1

Building a react app and ready to start the deploy process.

All my images are hosted in an assets folder nested inside the src folder.

folder structure and header component that has a Img tag pointing to the assets folder:

image
image966×605 50.6 KB

The only deployed assets i have are a loading GIF and my site logo, both display just fine when running a local server with Vite’s npm run dev command. but when taking a look at the deployed site here
https://warm-phoenix-c65f32.netlify.app/
both images return GET 404 image not found error, how is this even possible? what am i doing wrong.

GET 404 Not Found: https://warm-phoenix-c65f32.netlify.app/src/assets/svg’s/logo-no-background.svg

GET 404 Not Found:https://warm-phoenix-c65f32.netlify.app/src/assets/loading-app.gif

repo link if you want to take a look at complete structure and code layout

2

@michelestaffiere,

This is the (half) same situation as the last time: Page fails to load on mobile - Support - Netlify Support Forums

You need to go through some documentation and understand how assets are referenced. Your local device is not emulating a server and thus “it works with Live server” argument is incorrect. This is explained in Vite docs: Static Asset Handling | Vite (vitejs.dev)

TL;DR:

You need to put your assets in public folder and refer them using /svg's/logo-color.svg (an example).

This isn’t a Netlify question and it’s a problem with your setup.

1 Like
3

thank you for the documentation link and explanation! - Still a little confused of how the favicon is able to navigate into the assets folder then if it’s stored with the rest of my assets. Is there a reason for that?