如何在Gatsbyjs中正确设置和查询siteMetadata?

时间:2019-05-10 05:02:38

标签: graphql gatsby

我遇到的问题是,当我在gatsby-config.js文件中设置一个键-值对时,我看不到GraphiQL内的数据。我正在遵循文档并使用示例代码中使用的键。有关文档,请参见此处:https://www.gatsbyjs.org/docs/gatsby-config/#sitemetadata

这是我的gatsby-config.js文件:

module.exports = {
  siteMetadata: {
    title: `My Photography Site`,
    description: `Just the best`,
  },
  plugins: [
    `gatsby-plugin-emotion`,
    `gatsby-transformer-remark`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `src`,
        path: `${__dirname}/src/`,
      },
    },
    {
      resolve: `gatsby-plugin-typography`,
      options: {
        pathToConfigModule: `src/utils/typography`,
      },
    },
  ],
}

这是我的GraphiQL查询(在重新启动开发服务器以重新加载gatsby-config.js文件之后):

query SiteQuery {
  site {
    siteMetadata {
      title
      description
    }
  }
}

GraphiQL的预期结果:

{
  "data": {
    "site": {
      "siteMetadata": {
        "title": "My Photography Site",
        "description": "Just the best"
      }
    }
  }
}

这是GraphiQL的实际结果:

{
  "errors": [
    {
      "message": "Cannot query field \"description\" on type \"SiteSiteMetadata\".",
      "locations": [
        {
          "line": 5,
          "column": 7
        }
      ],
      "stack": [
        "GraphQLError: Cannot query field \"description\" on type \"SiteSiteMetadata\".",
        "    at Object.Field (/mnt/c/Users/Spencer/dev/gatsbyjs/hello-world/node_modules/graphql/validation/rules/FieldsOnCorrectType.js:64:31)",
        "    at Object.enter (/mnt/c/Users/Spencer/dev/gatsbyjs/hello-world/node_modules/graphql/language/visitor.js:334:29)",
        "    at Object.enter (/mnt/c/Users/Spencer/dev/gatsbyjs/hello-world/node_modules/graphql/language/visitor.js:385:25)",
        "    at visit (/mnt/c/Users/Spencer/dev/gatsbyjs/hello-world/node_modules/graphql/language/visitor.js:252:26)",
        "    at validate (/mnt/c/Users/Spencer/dev/gatsbyjs/hello-world/node_modules/graphql/validation/validate.js:63:22)",
        "    at /mnt/c/Users/Spencer/dev/gatsbyjs/hello-world/node_modules/express-graphql/dist/index.js:154:52",
        "    at processTicksAndRejections (internal/process/task_queues.js:89:5)"
      ]
    }
  ]
}

奇怪的是,我之前能够成功创建自定义键值对,并且效果很好。我有一个密钥tagLine和一个值Panda Site。普通的title键也可以正常工作。

以下是我正在使用的软件版本:

  • 盖茨比:2.5.12
  • 节点:v12.1.0
  • npm:6.9.0

我正在使用Linux的Windows子系统(WSL)运行。让我知道是否需要其他配置文件,包括package.json。

0 个答案:

没有答案