Gatsby-source-wordpress-experimental: Explain in error messages why "404'ing Media causes build to fail"

[ashhitch]

Previously I would just get a warning of 404s for media but now when the first post with inserted media which 404s I get an error and the build fails.

Received a 404 when trying to fetch

https://api.thesite.co.uk/wp-content/uploads/2013/11/lounge-diner-300x300.jpeg
from Post #4111 "Post with Image 404"

Most likely this image was uploaded to this Post and then deleted from the media library.
You'll need to fix this and re-save this Post to remove this warning at
https://api.thesite.co.uk/wp-admin/post.php?post=4111&action=edit.

 ERROR

Cannot read property 'id' of null

  TypeError: Cannot read property 'id' of null

  - process-node.js:196 fetchNodeHtmlImageMediaItemNodes
    [gatsby-theme-starter]/[gatsby-source-wordpress-experimental]/steps/source-nodes/create-nodes/process-node.js:196:23

  - next_tick.js:68 process._tickCallback
    internal/process/next_tick.js:68:7

The build completes if I set:

 html: {
   useGatsbyImage: false,
},

Plugin version 1.0.7
WP Gatsby 0.4.9
WpGraphQL 0.10.3

[Nazeh]

I get a 404 error too but I don't get any indication on the place of the image, and the html: { useGatsbyImage: false} don't solve the issue, I would be happy if at least I can tell where the image is used!

info  gatsby-source-wordpress  Unrecoverable error
 occured while fetching media item #23787

Media item link: https://********.com/
?attachment_id=23787

 ERROR 

failed to process https://********.com/wp-content/uploads/2020/04/COVID-19-Event-Cancellations-1.png
HTTPError: Response code 404 (Not Found)

[TylerBarnes]

Hi @ashhitch , this is actually by design to prevent deploying a broken site. We were considering this a feature because an admin can delete an image from the media library without knowing where that image lives. All pages or posts that had that image in html will then be broken. The link where the image is used is added to the error so that the site can be fixed https://github.com/gatsbyjs/gatsby-source-wordpress-experimental/issues/20

@Nazeh your issue is a bit different actually. In your case you have a media item that exists in WordPress but the image file for it has been deleted on disk. I will look at improving that error message but you should be able to go to the media item with a db id of 23787 to see which media item is missing files.

[TylerBarnes]

Oh @Nazeh actually the error message includes the link to the media item too Media item link: https://********.com/?attachment_id=23787. I will add a note about what this means to the error

[ashhitch]

@TylerBarnes i do think it would be handy to have an option especially in dev to allow them through like before with just a warning.

Along with just being able to ignore old posts with missing media.
A use-case I have is I'm dev'ing a site with a lot of media but I don't want to copy all the media down to staging.

[TylerBarnes]

@ashhitch , that's a really good use-case. I'll put this on my list and have another crack at it.

[ashhitch]

@TylerBarnes Thank you! Keep up the awesome work.

[rickgregory]

@TylerBarnes - another vote for not having a 404 halt the build, especially when doing a development build. I'm currently exploring using Gatsby for a news site and I can't actually finish a develop build because of a late 404. I want the warning, but I'd like to be able to actually have the build finish. As it is, I have to fix every 404 before I can even start seeing how this will work and since it halts on the first 404 I can't tell if I have just one to fix or 100.

[ashhitch]

@rickgregory
as a temp workaround, you could add a redirect rule for all 404'ing images on your wordpress site...
it's not ideal but will get you out of a bind:

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} !-f
RewriteRule \.(gif|jpe?g|png|bmp|webp) /placeholder.png [NC,L]
</IfModule>

[TylerBarnes]

404's no longer fail the build in development as of [email protected]. I've also added an additional line to the error in production when the build fails to explain why this is the case.

Thanks for opening this issue and for your patience!