Cannot query field "references" on type "ContentfulBlogPostBody"

[Nicholas-Westby]

Yesterday (August 3rd, 2022), I created a Contentful account and cloned this repo. I ran npm i, npm run setup, and npm run dev. That last command led to this output:

Windows PowerShell
Copyright (C) Microsoft Corporation. All rights reserved.
Install the latest PowerShell for new features and improvements! https://aka.ms/PSWindows
PS C:\r\starter-gatsby-blog> npm run dev
> [email protected] dev
> gatsby develop
success compile gatsby files - 2.756s
success load gatsby config - 0.019s
success load plugins - 1.028s
success onPreInit - 0.008s
success initialize cache - 0.033s
success copy gatsby files - 0.261s
success Compiling Gatsby Functions - 0.375s
success onPreBootstrap - 0.394s
success createSchemaCustomization - 0.195s
success Contentful: Sync changed items - 0.194s - 1/1 5.15/s
success Contentful: Fetch data - 0.524s
info Contentful: 0 new entries                                                                                                                             
info Contentful: 0 updated entries                                                                                                                         
info Contentful: 0 deleted entries                                                                                                                         
info Contentful: 7 cached entries
info Contentful: 0 new assets                                                                                                                              
info Contentful: 0 updated assets                                                                                                                          
info Contentful: 5 cached assets                                                                                                                           
info Contentful: 0 deleted assets
success Contentful: Create nodes - 0.016s
success Contentful: Process data - 0.060s
success Checking for changed pages - 0.001s                                                                                                                
success source and transform nodes - 0.704s                                                                                                                
success building schema - 0.445s
success createPages - 0.023s
success createPagesStatefully - 0.056s
info Total nodes: 52, SitePage nodes: 6 (use --verbose for breakdown)                                                                                      
success Checking for changed pages - 0.002s                                                                                                                
success write out redirect data - 0.002s                                                                                                                   
success onPostBootstrap - 0.002s
info bootstrap finished - 9.302s                                                                                                                           
success onPreExtractQueries - 0.001s                                                                                                                       

 ERROR #85923  GRAPHQL

There was an error in your GraphQL query:

Cannot query field "references" on type "ContentfulBlogPostBody".

If you don't expect "references" to exist on the type "ContentfulBlogPostBody" it is most likely a typo.
However, if you expect "references" to exist there are a couple of solutions to common problems:

- If you added a new data source and/or changed something inside gatsby-node.js/gatsby-config.js, please try a restart of your development server
- The field might be accessible in another subfield, please try your query in GraphiQL and use the GraphiQL explorer to see which fields you can query and 
what shape they have
- You want to optionally use your field "references" and right now it is not used anywhere. Therefore Gatsby can't infer the type and add it to the GraphQL
 schema. A quick fix is to add at least one entry with that field ("dummy content")

It is recommended to explicitly type your GraphQL schema if you want to use optional fields. This way you don't have to add the mentioned "dummy content". 
Visit our docs to learn how you can define the schema for "ContentfulBlogPostBody":
https://www.gatsbyjs.com/docs/reference/graphql-data-layer/schema-customization#creating-type-definitions


C:\r\starter-gatsby-blog\src\templates\blog-post.js
  115:9  error  Cannot query field "references" on type "ContentfulBlogPostBody"  graphql/template-strings

✖ 1 problem (1 error, 0 warnings)


failed Building development bundle - 4.690s
ERROR in
C:\r\starter-gatsby-blog\src\templates\blog-post.js
  115:9  error  Cannot query field "references" on type "ContentfulBlogPostBody"  graphql/template-strings

✖ 1 problem (1 error, 0 warnings)


develop compiled with 1 error
success Writing page-data.json files to public directory - 0.125s - 2/6 48.13/s
Restarting function watcher due to change to "C:\r\starter-gatsby-blog\.env.development"
success Re-building functions
Restarting function watcher due to change to "C:\r\starter-gatsby-blog\.env.development"
success Re-building functions
Restarting function watcher due to change to "C:\r\starter-gatsby-blog\.env.development"
success Re-building functions

The main error of interest here is:

There was an error in your GraphQL query:

Cannot query field "references" on type "ContentfulBlogPostBody".

Note that I logged into Contentful and verified it seemed to create all the content types and content nodes fine.

I am thinking the error is related to this bit of code in blog-post.js:

      body {
        raw
        references {
          ... on ContentfulAsset {
            contentful_id
            title
            description
            gatsbyImage(width: 1000)
            __typename
          }
        }
      }

The part that mentions "references". I am not super familiar with Gatsby/GraphQL/Contentful, so not sure exactly what the issue/fix is, but it seems like it's probably related to the code mentioned above.

That references block of code seems to have been added a few days ago in this commit: 863c048 ("Adding inline images to body of blog post")

EDIT: If I remove the following:

        references {
          ... on ContentfulAsset {
            contentful_id
            title
            description
            gatsbyImage(width: 1000)
            __typename
          }
        }

Then it seems to work fine. I imagine there was some purpose for that though, so unsure of the implications of removing it.

[caroso1222]

for anyone that comes here again, this is the right query to handle images, but the error happens if you don't have any post in contentful with an embedded asset. try adding an image as an embedded asset in any of your post and see if the error goes away