Beginner Friendly But With TLDRs!

Gatsby + Contentful Rich Text: How to migrate to gatsby-source-contentful version 4+ in early 2021

The gatsby-source-contentful plugin changed a lot in late 2020, from version 2 to version 4. One significant breaking change concerned Rich Text fields, especially if you have linked/embedded Contentful content and assets in your RichText Field. Fixing this breaking change can be tricky, especially if you are fairly new to GraphQL and Gatsby.

Overview

Bad Optional Embeds: The Symptoms

success onPreExtractQueries - 0.002sERROR #85901 GRAPHQLThere was an error in your GraphQL query:Fragment cannot be spread here as objects of type “ContentfulAssetContentfulPostContentfulTagUnion” can never be of type “ContentfulPage”.

The Fix

A Gist

How I Found The Fix

Capture Happy Path Schema

Capture Sad Path Schema

What Had Changed?

union ContentfulAssetContentfulPageContentfulPostContentfulTagUnion = ContentfulAsset | ContentfulPage | ContentfulPost | ContentfulTag
union ContentfulAssetContentfulPageContentfulPostContentfulTagUnion = ContentfulAsset | ContentfulPage | ContentfulTag

Dad, Software Engineer, Tech Educator

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store