Deployed to netlify .. images not loading

I have a very simple demo page, with is working fine locally but when deployed/hosted on Netify does not show or load the images.
repo: GitHub - iirving/threejs-3d-scroll: 3d scroll page with ThreeJS
deployed to:

getting a GET response 404 not found

no other errors expect for the images (space, moon, avatar ) 404’ing :frowning:

this has your answer Static Asset Handling | Vite

either import the asset, it will give you a hashed url, then it can reside within your src folder (or root in your case). or place the assets into a/the public folder and use “/name.png” as the url.

the reason why it works locally is because the files happen to be present. but you’re not telling the bundler about them, so it won’t take them to the dist, they’re not part of the project in production.

1 Like

moving the image to a public directory (no other changes) did the trick!!

many thanks!

1 Like

Hi @iani and @drcmda,

I have moved the asset the the public folder but it still does. not work. I have chcked Ian’s code and it is exactly the same same as mine if we talk about TextureLoder and it’s path.

I try to host it in vercel…

this is my GitHub: GitHub - maliaaska/cvc at work

Do you have any idea?
Thanks in advance!

you’re still using relative paths, for instance .load("./pictures/universe.jpeg") ./pictures is not a valid path. / points to your public.

@drcmda. Thank you for the reply.
At my timezone was already late and I forgot to mention that I was only trying to use the public path to ‘profile.png’.
I have tried with all of them, and it still does not work.

it looks like it doesnt get to the public folder at all…

In the index.html file when i point /public/img.jpeg all works correct.
This does not work either /img.jpeg nor /public/img.jpeg

Even in the console it tells me that files in the public directory are served in the path root…

Thank you for any interest given me in solving that issue !