northstack / gatsby-wordpress-twenty-nineteen

A re-creation of the WordPress Twenty Nineteen theme in Gatsby, using WordPress/WPGraphQL as a backend. Non-production example code.
GNU General Public License v3.0
41 stars 4 forks source link

Cannot query field "wpgraphql" on type "Query". #4

Open Abvpeytz opened 5 years ago

Abvpeytz commented 5 years ago

I have followed the Usage-guide, but keeps getting the following error on gatsby develop:

"gatsby-node.js" threw an error while running the createPages lifecycle:

Cannot query field "wpgraphql" on type "Query".

GraphQL request:3:4
2 |             query {
3 |                     wpgraphql {
  |    ^
4 |                             posts {

  Error: Cannot query field "wpgraphql" on type "Query".
  GraphQL request:3:4
  2 |  query {
  3 |  wpgraphql {
    |    ^
  4 |  posts {

Do you have any idea why?

/ A

JeffMatsonPagely commented 5 years ago

It sounds like you might have a misconfiguration of your source WordPress site. Could you post the contents of your gatsby-config.js and config.js?

Abvpeytz commented 5 years ago

I have reverted most of my changes back to your original files.

config.js

const Config = {
    source: {
        protocol: 'http',
        baseUrl: 'peytzdk.test',
    },
    destination: {
        protocol: 'http',
        baseUrl: 'localhost:8000',
    },
    commentList: {
        dynamic: true,
    },
    dynamicPosts: false,
};

Config.source.url = Config.source.protocol + '://' + Config.source.baseUrl;
Config.destination.url = Config.destination.protocol + '://' + Config.destination.baseUrl;

module.exports = Config;

gatsby-config.js

const Config = require('./config');

module.exports = {
    siteMetadata: {
        title: `WordPress Headless + Gatsby + Twenty Nineteen Theme Example`,
        description: `Re-creating Twenty Nineteen with Gatsby and pulling content from WordPress.`,
        author: `@TheJeffMatson`,
    },
    plugins: [
        `gatsby-plugin-react-helmet`,
        {
            resolve: `gatsby-source-graphql`,
            options: {
                typeName: `WPGraphQL`,
                fieldName: `wpgraphql`,
                url: Config.source.url + '/graphql',
            },
        },
        `gatsby-transformer-sharp`,
        `gatsby-plugin-sharp`,
    ],
};
JeffMatsonPagely commented 5 years ago

Thanks.

Have you installed/activated WPGraphQL on your WordPress site? Have you confirmed that the endpoint is working correctly (http://peytzdk.test/graphql)?

Abvpeytz commented 5 years ago

I have installed and activated the plugin, but i get the following message when i go to peytzdk.test/graphql

Skærmbillede 2019-08-19 kl  20 57 25
nerdess commented 4 years ago

@Abvpeytz the message you get at peytzdk.test/graphql is correct! that is what is expected to be there.

i recommend you install this wordpress plugin so you can check your queries directly in wordpress first: https://github.com/wp-graphql/wp-graphiql

also, run "gatsby clean" to ensure there is no caching-issue somewhere...

ajmalfaiz commented 4 years ago

i have the same issue

strtsv commented 4 years ago

It looks like you haven't configured your gatsby-source-graphql plagin in gatsby-config.js. You need to add to your gatsby-config.js next lines: plugins: [ { resolve: "gatsby-source-graphql", options: { typeName: "WPGraphQL", fieldName: "wpgraphql", url: "http://wp.local/graphql", }, } ...