gatsby develop on a localhost Wordpress: Cannot query field "allWordpressTag" on type "Query"

Created on 9 Dec 2018  Â·  4Comments  Â·  Source: gatsbyjs/gatsby

Description

gatsby develop spits an error message on a localhost Wordpress install.

Steps to reproduce

  1. install gatsby
  2. gatsby new gatsby-wordpress https://github.com/GatsbyCentral/gatsby-starter-wordpress
  3. in gatsby-config.js set baseUrl: 'localhost/lynx', and protocol: 'http',
  4. gatsby develop

Expected result

A successful prompt

Actual result

cs@cs-swift:~/work/gatsby-wordpress$ gatsby develop > error.txt
Cannot query field "allWordpressTag" on type "Query". Did you mean "allWordpressPage", "allWordpressPost", "wordpressPage", "allWordpressWpTypes", or "allWordpressCategory"?

GraphQL request (3:11)
2:         {
3:           allWordpressTag(filter: { count: { gt: 0 } }) {
             ^
4:             edges {

error gatsby-node.js returned an error
error UNHANDLED REJECTION

The complete error log is:

cs@cs-swift:~/work/gatsby-wordpress$ more error.txt 
success open and validate gatsby-config — 0.006 s
success load plugins — 0.245 s
success onPreInit — 0.224 s
success delete html and css files from previous builds — 0.006 s
success initialize cache — 0.009 s
success copy gatsby files — 0.015 s
success onPreBootstrap — 0.004 s
 -> wordpress__POST fetched : 1
 -> wordpress__PAGE fetched : 1
 -> wordpress__wp_media fetched : 1
 -> wordpress__wp_types fetched : 1
 -> wordpress__wp_statuses fetched : 1
 -> wordpress__wp_taxonomies fetched : 1
 -> wordpress__CATEGORY fetched : 1
 -> wordpress__TAG fetched : 0
 -> wordpress__wp_users fetched : 1
The server response was "401 Unauthorized"
Inner exception message : "You are not currently logged in."
 -> wordpress__wp_comments fetched : 1
The server response was "401 Unauthorized"
Inner exception message : "Sorry, you are not allowed to do that."
success source and transform nodes — 0.271 s
success building schema — 0.442 s


  GraphQLError: Cannot query field "allWordpressTag" on type "Query". Did you me  
an "allWordpressPage", "allWordpressPost", "wordpressPage", "allWordpressWpTyp  es", or "allWordpressCatego
ry"?

  - debuggability.js:313 Promise._execute
    [lib]/[gatsby-cli]/[bluebird]/js/release/debuggability.js:313:9

  - promise.js:483 Promise._resolveFromExecutor
    [lib]/[gatsby-cli]/[bluebird]/js/release/promise.js:483:18

  - promise.js:79 new Promise
    [lib]/[gatsby-cli]/[bluebird]/js/release/promise.js:79:10

  - index.js:300 graphqlRunner
    [gatsby-wordpress]/[gatsby]/dist/bootstrap/index.js:300:14

  - gatsby-node.js:142 graphql.then.then.then.then.then.then
    /home/cs/work/gatsby-wordpress/gatsby-node.js:142:14

  - util.js:16 tryCatcher
    [lib]/[gatsby-cli]/[bluebird]/js/release/util.js:16:23

  - promise.js:512 Promise._settlePromiseFromHandler
    [lib]/[gatsby-cli]/[bluebird]/js/release/promise.js:512:31

  - promise.js:569 Promise._settlePromise
    [lib]/[gatsby-cli]/[bluebird]/js/release/promise.js:569:18

  - promise.js:614 Promise._settlePromise0
    [lib]/[gatsby-cli]/[bluebird]/js/release/promise.js:614:10

  - promise.js:694 Promise._settlePromises
    [lib]/[gatsby-cli]/[bluebird]/js/release/promise.js:694:18

  - promise.js:638 Promise._fulfill
    [lib]/[gatsby-cli]/[bluebird]/js/release/promise.js:638:18

  - promise.js:432 Promise._resolveCallback
    [lib]/[gatsby-cli]/[bluebird]/js/release/promise.js:432:57

  - promise.js:524 Promise._settlePromiseFromHandler
    [lib]/[gatsby-cli]/[bluebird]/js/release/promise.js:524:17




  TypeError: Cannot read property 'filter' of undefined

  - api-runner-node.js:274 Promise.mapSeries.catch.then.results
    [gatsby-wordpress]/[gatsby]/dist/utils/api-runner-node.js:274:42

  - util.js:16 tryCatcher
    [gatsby-wordpress]/[bluebird]/js/release/util.js:16:23

  - promise.js:512 Promise._settlePromiseFromHandler
    [gatsby-wordpress]/[bluebird]/js/release/promise.js:512:31

  - promise.js:569 Promise._settlePromise
    [gatsby-wordpress]/[bluebird]/js/release/promise.js:569:18

  - promise.js:614 Promise._settlePromise0
    [gatsby-wordpress]/[bluebird]/js/release/promise.js:614:10

  - promise.js:694 Promise._settlePromises
    [gatsby-wordpress]/[bluebird]/js/release/promise.js:694:18

  - async.js:138 _drainQueueStep
    [gatsby-wordpress]/[bluebird]/js/release/async.js:138:12

  - async.js:131 _drainQueue
    [gatsby-wordpress]/[bluebird]/js/release/async.js:131:9

  - async.js:147 Async._drainQueues
    [gatsby-wordpress]/[bluebird]/js/release/async.js:147:5

  - async.js:17 Immediate.Async.drainQueues [as _onImmediate]
    [gatsby-wordpress]/[bluebird]/js/release/async.js:17:14

Environment

cs@cs-swift:~/work/gatsby-wordpress$ gatsby info --clipboard

  System:
    OS: Linux 4.15 Ubuntu 18.04.1 LTS (Bionic Beaver)
    CPU: (4) x64 Intel(R) Core(TM) i5-7Y54 CPU @ 1.20GHz
    Shell: 4.4.19 - /bin/bash
  Binaries:
    Node: 11.2.0 - /usr/local/bin/node
    Yarn: 1.9.4 - /usr/bin/yarn
    npm: 6.4.1 - /usr/local/bin/npm
  Browsers:
    Chrome: 70.0.3538.77
    Firefox: 63.0.3
  npmPackages:
    gatsby: ^2.0.0 => 2.0.7 
    gatsby-awesome-pagination: ^0.3.3 => 0.3.3 
    gatsby-plugin-lodash: ^3.0.1 => 3.0.1 
    gatsby-plugin-netlify: ^2.0.0 => 2.0.0 
    gatsby-plugin-purgecss: ^2.4.0 => 2.4.0 
    gatsby-plugin-react-helmet: ^3.0.0 => 3.0.0 
    gatsby-plugin-sass: ^2.0.1 => 2.0.1 
    gatsby-plugin-sharp: ^2.0.5 => 2.0.5 
    gatsby-remark-images: ^2.0.1 => 2.0.1 
    gatsby-source-filesystem: ^2.0.1 => 2.0.1 
    gatsby-source-wordpress: ^3.0.1 => 3.0.1 
    gatsby-transformer-remark: ^2.1.1 => 2.1.3 
    gatsby-transformer-sharp: ^2.1.1 => 2.1.1 
  npmGlobalPackages:
    gatsby-cli: 2.4.6

Most helpful comment

Make sure at least 1 post has at least 1 tag.

All 4 comments

Make sure at least 1 post has at least 1 tag.

@metamn sorry for the late response, i've picked up on your issue and did a bit of investigation on what might be the cause of this.
I'm going to break down my answer, to see if we can pinpoint on what might be the culprit and fix it.

  • Started by installing wordpress on wsl (windows subsystem for linux) with a name of wordpress, but despite the diference of names, same case will probably apply.
  • Changed the default post created by wordpress by adding a category named "dummy" and a couple of tags named "first" and "post" respectively.
  • Created another one with the same tags and category just to be sure
  • Cloned the repo you have mentioned and before issuing the install command i've checked the dependencies and saw that those are a bit outdated. So i've updated the dependencies and on my end the package.json file had the following structure.
{
  "name": "gatsby-starter-wordpress",
  "description": "Gatsby v2 starter for WordPress",
  "version": "0.1.0",
  "author": "GatsbyCentral.com",
  "keywords": [
    "gatsby"
  ],
  "license": "MIT",
  "main": "n/a",
  "scripts": {
    "start": "npm run develop",
    "clean": "rimraf .cache public",
    "build": "npm run clean && gatsby build",
    "develop": "npm run clean && gatsby develop",
    "serve": "gatsby serve",
    "format": "prettier --trailing-comma es5 --no-semi --single-quote --write \"{gatsby-*.js,src/**/*.js}\"",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "prettier": {
    "trailingComma": "es5",
    "semi": false,
    "singleQuote": true
  },
  "dependencies": {
    "bulma": "^0.7.2",
    "gatsby": "^2.0.67",
    "gatsby-awesome-pagination": "^0.3.3",
    "gatsby-plugin-lodash": "^3.0.3",
    "gatsby-plugin-purgecss": "^2.4.0",
    "gatsby-plugin-react-helmet": "^3.0.4",
    "gatsby-plugin-sass": "^2.0.7",
    "gatsby-plugin-sharp": "^2.0.15",
    "gatsby-remark-images": "^3.0.1",
    "gatsby-source-filesystem": "^2.0.12",
    "gatsby-source-wordpress": "^3.0.20",
    "gatsby-transformer-remark": "^2.1.15",
    "gatsby-transformer-sharp": "^2.1.9",
    "lodash": "^4.17.11",
    "node-sass": "^4.11.0",
    "prop-types": "^15.6.2",
    "react": "^16.6.3",
    "react-dom": "^16.6.3",
    "react-helmet": "^5.2.0",
    "uuid": "^3.3.2"
  },
  "devDependencies": {
    "eslint-config-airbnb": "^17.1.0",
    "eslint-config-prettier": "^3.3.0",
    "prettier": "^1.15.3",
    "rimraf": "^2.6.2"
  }
}
  • Then i moved onto the gatsby-config.js, beforehand i've opened the gatsby-wordpress-plugin docs here and made some changes accordingly, the file on my end now looks like this.
module.exports = {
  siteMetadata: {
    title: 'Gatsby + WordPress Starter',
  },
  plugins: [
    'gatsby-plugin-react-helmet',
    'gatsby-plugin-sass',
    {
      resolve: 'gatsby-source-wordpress',
      options: {
        // The base url to your WP site.
        baseUrl: 'localhost/wordpress/',
        // WP.com sites set to true, WP.org set to false
        hostingWPCOM: false,
        // The protocol. This can be http or https.
        protocol: 'http',
        // Use 'Advanced Custom Fields' Wordpress plugin
        useACF: false,
        auth: {},
        // Set to true to debug endpoints on 'gatsby build'
        verboseOutput: false,
        includedRoutes: [
          "/*/*/posts",
          "/*/*/pages",
          "/*/*/media",
          "/*/*/categories",
          "/*/*/tags",
          "/*/*/taxonomies",
          "/*/*/users",
        ],
      },
    },
    'gatsby-plugin-sharp',
    'gatsby-transformer-sharp',
    'gatsby-plugin-purgecss',
  ],
}
  • After issuing gatsby develop or gatsby build some errors where being thrown, in development mode as it's more permissive it would continue with the process, but the content would not be displayed. In production mode it would stop the build.
    After a bit of digging i pinpointed the culprit to the category template and the following graphql query.
allWordpressPost(filter: { categories: { slug: { eq: $slug } } }) {
      totalCount
      edges {
        node {
          ...PostListFields
        }
      }
    }

It was saying that $slug was undefined, even checking that in the gatsby-node file it was being handed down to the context as it should.
Fired up the gatsby graphiql editor and saw that the query had changed.
Instead of what's stated in the repo now on my end it looks like this

    allWordpressPost(filter: {categories: {elemMatch: {slug: {eq: $slug}}}}) {
      totalCount
      edges {
        node {
          ...PostListFields
        }
      }
    }
  }
`

  • After the change, issued gatsby develop just to check if everything was working and then a similar issue as what was happening with the categories was then thrown, this time with the tags.
    Once again checked the query in gatsby graphiql editor, and saw that it changed aswell.
    Now on my end the query looks like this as oposed of this
allWordpressPost(filter: {tags: {elemMatch: {slug: {eq: $slug}}}}){
      totalCount
      edges {
        node {
          ...PostListFields
        }
      }
    }

With these changes i was then able to get a successful build. In either development and production mode.
Check if the changes i mentioned can solve your issue and report back with some feedback if you don't mind.

Thanks @domegang that was the issue. After adding a tag all works fine now.

Added a dummy Tag. That works for me

Was this page helpful?
0 / 5 - 0 ratings

Related issues

dustinhorton picture dustinhorton  Â·  3Comments

mikestopcontinues picture mikestopcontinues  Â·  3Comments

jimfilippou picture jimfilippou  Â·  3Comments

ghost picture ghost  Â·  3Comments

Oppenheimer1 picture Oppenheimer1  Â·  3Comments