Some images producing 'failed to load resource' error on Netlify build

#1

Apologies in advance if this is an obvious issue but I’ve searched and can’t find a solution.

I have a Netlify site built with Gatsby.

I made a new commit today and the site rebuilt with no problems. However, when I looked at the page it was missing two of the images. Error in the console is:
“Failed to load resource: the server responded with a status of 404”

I did not change any code concerning these images, they always worked fine previously and when I set the site to use a previously working deploy the images still aren’t there.
The images are totally fine in the gatsby dev environment and totally fine when I build and serve the site locally. They’re definitely in the connected git repo.

To make matters even more confusing, I have done a number of builds since this issue arose (as I’ve been changing other, unrelated things) and on one of the builds the images were fine!

The images are displayed using gatsby-image. Not sure if that’s relevant. Other images using the exact same template/equivalent queries are totally fine.

Any idea what’s going on? I’m totally baffled.

2 Likes
#2

I’d be checking whether we built what you intended, by using the site download demonstrated in the screenshot in this article:

Then we’ll know whether to debug the build, or the browse experience.

Also you should probably check out this article for some pro tips on the best gatsby experience in our CI / CDN:

1 Like
#3

I’m having a similar issue as well. I find that uploading the /public folder directly from a local build and serve will preserve all the images, but I would love a solution where I can rely on auto-publishing to update my site instead of needing to log in and upload files every time.

I’ve checked the site download, and those images are not in the build’s static files.

My current site is from an upload from a local build with all images in place: https://jessicagabejar.com/

When deploying, while the images are not built, the “blur” image is built, example: https://pbs.twimg.com/media/D9D0Q1wWkAE0GZK?format=jpg&name=large

A few of these images have been resized and reformatted (from png to jpg) to reduce their sizes.

I clear cache often locally, and since this issue began, on Netlify as well before deploying. Interestingly, which images show up in the build differ from deploy to deploy. Not sure how that happens.

2 Likes
#4

Hi, have you checked your earlier commits before this started happening to see if you updated any of your dependencies? In our build environment all we’re doing is cloning your repo, installing your dependencies, and then running the build command you specify. Your build should be repeatable given the same dependencies and source files.

1 Like
#5

Thanks! This issue started happening after updating Gatsby for the first time in this project. Someone recently opened up a similar issue in the Gatsby repo so I’ll be following that as well! Thank you again.

2 Likes
#6

Hi @JessAbejar, I’ve been experiencing the same issues when updating Gatsby. Can you post a link to the issue in the Gatsby repo? This would be much appreciated!
Also, have you experienced blank pages when the page refreshes after updating?

1 Like
#7

Here it is: https://github.com/gatsbyjs/gatsby/issues/14953

I realized that their error messages are different (I experience 404 messages).

2 Likes
#8

if anything changes, please come back here and let us know so others can benefit!

1 Like
#9

Can confirm setting gatsby to version 2.8.8 in package.json fixed the issue. Hope the fab Gatsby devs fix this soon. Thank you!

“gatsby”: “~2.8.8”,

2 Likes