Problem loading background-image

It returns a 404 error for the background-image image in netlify but on my localhost it doesn’t give me that error. In theory, the route is wrong and that’s why it can’t find the image, but I don’t know how to solve it.

It should look like this:

Repository: GitHub - Fran-Romar/Romar-Weather-App
Netflify App: https://65253cefce50f615a2964c1a--stellar-semolina-a17f56.netlify.app/

Please help me, thank you.

Hi @FranRomar,

Is that the correct site? I ask cause it appears to have been deleted. Have you deployed to a different site? If so, could you provide the url for that site?

Hi @FranRomar,

As far as I know, you need to create a public directory next to the src directory,
and move the assets to the public directory.

Then you can link to /assets/image.png without the public/ prefix.

The src/ directory isn’t available I think.

Gr,

Andy

This thought was just by looking at your code, but providing us with the correct URL as @Melvin asked will make it simpeler for us to help you. :wink:

Gr,

Andy

This is the site:
https://romar-weather-app.netlify.app/

Sorry for the inconvenience

Hi @FranRomar,

As mentioned above, your directory structure seems wrong:

Gr,

Andy

If I put the images in a public folder at the root of the directory and then put this url: const imgUrl = url("/assets/${img}.png");
It doesn’t work for me either, not even on localhost. I don’t quite understand how I should structure the images and what path to use for them to load.

I just solved it by setting only the file name as the path. Thanks for the help

2 Likes

thanks for sharing your solution.