Home
Support Forums

Chrome console shows resource not found 404

Hi, my site is deployed at: https://gifted-poincare-2d3b82.netlify.app/

The error I am facing with multiple images in the chrome console is:

My deploy log is successful with no issues.

When I deploy the site locally I can see all the images being rendered perfectly.
All the images are uploaded to github also, I double-checked. They are rendering there also.

Once deployed on netlify, the images aren’t loading on the domain.
I downloaded the deployed build from netlify and tried to run it locally on my laptop. I am facing the same error here too, even though the images are present where they should be.

Can we check your repo?

@kiran_stone I know you checked that the images are in the correct places, but this still looks to be an issue with incorrect paths. You might want to double-check that the image paths match the link paths.

Hello,

Your images are located at https://gifted-poincare-2d3b82.netlify.app/img/knr-assets/image_6.png and not https://gifted-poincare-2d3b82.netlify.app/company-website/img/knr-assets/image_6.png, notice that I removed company-website from the URL.

Asset handling for static websites can be cumbersome from time to time, as your local developer server handles them differently then the final build. Make sure you use the correct paths :slight_smile:

1 Like

I just noticed that, thank you so much. Fixed the issue.

Cheers!

Hello,

I’m having a similar problem. Most of the images are working on the site: https://thesmartestcity.netlify.app except for a texture that I am using in a Three JS file. The image is loading locally but not in production:

I understand there is a path error but not sure what to change in order for the image to load.

The site is built with VueJs, Three JS, Vite, and TailwindCSS.

This is the reference to the image in the Three JS file.
image

Hi, @jaykhan-dev. I would recommend downloading the deploy to see what files exist and what their paths are.

You are referencing the file about as this path:

/src/assets/trigan-silver-black_1.png

However, that is not the path of the deployed file. The file’s actual path (in the current production deploy) is this:

/assets/trigan-silver-black_1.098fdbe5.png

Your site javascript must reference the file at its deployed path, not the path in the repo. The repo isn’t present after the deploy and only the contents of the publish directory are available after the build completes. That is why you must use the path as found in, and relative to the base of, the publish directory.

I also want to point out that adding the hash in the filename (the .098fdbe5 added to the deployed filename) is both not required and not recommended for sites hosted at Netlify. You can put hashes in the filenames if you want to but it definitely isn’t necessary at Netlify because of our automatic fine-grain cache invalidation.

If there are other questions, please let us know.