Difference between prismic.io/graphql and localhost/__graphql

[kevindamstra]

When you setup a prismic project, you can access the url http://localhost:8000/__graphql to build you queries. Let's say I want to query the homepage heading;

{
  allPrismicHomepage {
    edges {
      node {
        data {
          heading {
            text
          }
        }
      }
    }
  }
}

We get the following result;

{
  "data": {
    "allPrismicHomepage": {
      "edges": [
        {
          "node": {
            "data": {
              "heading": [
                {
                  "text": "Welcome"
                }
              ]
            }
          }
        }
      ]
    }
  },
  "extensions": {}
}

So you would think you could use this query in your pages, but once I do I don't get to see anything. When I test this query on https://myproject.prismic.io/graphql, I get the following message;

"Query does not pass validation. Violations:\n\nCannot query field 'allPrismicHomepage' on type 'Query'. Did you mean 'allHomepages'? (line 2, column 3):\n allPrismicHomepage {\n ^"

What is the difference between "allPrismicHomepage" and "allHomepages"?

Just for information, I'm using the 'gatsby-source-prismic' instead of the 'gatsby-source-prismic-graphql'

With best regards,

[marcellothearcane]

It's my understanding that gatsby-source-prismic modifies the GraphQL API away from what Prismic provides.

You're seeing this in the fact it adds Prismic to type names (i.e. allPrismicHomepage and the like), which is meant to namespace the Prismic GraphQL in your Gatsby project. Fragments are different too, as it uses things like PrismicPageBodyRichText rather than PageBodyText.

I think it modifies the image and rich text responses too, so you won't have access to the same data or schema when accessing through your Prismic repository's GraphQL.

You'll need to rework your request to something like this - use Ctrl/Cmd + Space to autofill the schema:

query {
  allHomepages {
    edges {
      node {
        heading {
          text
        }
      }
    }
  }
}

I'd recommend using http://localhost:8000/__graphql all the time, to save having to rewrite your queries.