CODEWITHSUNDEEP
wordpressgraphqlgatsbyheadless-cms
LaikaTheSpaceDog
LaikaTheSpaceDog

Reputation: 420

Wordpress schema not appearing at Gatsby /___graphql endpoint

I'm trying to set up Gatsby to create a headless Wordpress site. I have a local Wordpress environment set up and working with the following plugins installed and active:

Everything seems to be working as expected on the Wordpress end. I've now been trying to set up my local Gatsby site to work and pull from Wordpress using the Gatsby Source GraphQL plugin, however the wordpress scheme just isn't appearing in my GraphiQL interface at http://localhost:8000/___graphql/.

Here is my gatsby-config.js:

module.exports = {
  siteMetadata: {
    title: "Portfolio Site",
  },
  plugins: [
    {
      resolve: "gatsby-source-graphql",
      options: {
        typeName: "WPGraphQL",
        fieldName: "wpgraphql",
        url: "http://local.test/graphql",
        refetchInterval: 60,
      },
    },
  ],
};

And here is the contents of my package.json:

{
  "name": "portfolio-site",
  "version": "1.0.0",
  "private": true,
  "description": "Portfolio Site",
  "author": "jsaget",
  "keywords": [
    "gatsby"
  ],
  "scripts": {
    "develop": "gatsby develop",
    "start": "gatsby develop",
    "build": "gatsby build",
    "serve": "gatsby serve",
    "clean": "gatsby clean"
  },
  "dependencies": {
    "@fontsource/syne-mono": "^4.2.2",
    "gatsby": "^2.32.3",
    "gatsby-source-graphql": "^2.14.0",
    "gatsby-source-wordpress": "^4.0.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "typewriter-effect": "^2.17.0"
  }
}

When I run npm run develop in the terminal to spin up my local Gatsby, I get the following error and warning in the console:

 ERROR #11321  PLUGIN

"gatsby-source-graphql" threw an error while running the sourceNodes lifecycle:



warn The gatsby-source-graphql plugin has generated no Gatsby nodes. Do you need it?

A colleague has set up this Gatsby environment in the exact same way as me (same versions of all dependencies etc.), and it works fine on his machine but not on mine. Could some global npm modules or something else be interfering? Or could it be something on the Wordpress end?

Just for extra clarity, my expectation would be that a dropdown field would appear here titled wpgraphql (as in the gatsby-config.js): GraphiQL screenshot

Upvotes: 0

Views: 1105

Answers (3)

Amirhossein Ranjbar
Amirhossein Ranjbar

Reputation: 1

If you get this bug in WordPress! You need to log out of the user account and administration and then enter the administration and graphql section again

Upvotes: 0

Bashid
Bashid

Reputation: 520

gatsby clean && gatsby develop worked for me!

Upvotes: 0

Pénélope
Pénélope

Reputation: 1

Same here, but I found something!

Go to WordPress dashboard > GraphQL > Settings: Tick the box "Enable GraphQL Debug Mode"

Go back to your terminal: gastby clean, then npm run develop

wpgraphql should now appear in http://localhost:8000/___graphql

Upvotes: 0

Related Questions