Gatsby Remark 插件：创建的节点对 GraphIQL 可见，但在 Gatsby 页面上的查询返回 null答案

【问题标题】：Gatsby Remark plugin: Created nodes visible to GraphIQL but queries on Gatsby pages return nullGatsby Remark 插件：创建的节点对 GraphIQL 可见，但在 Gatsby 页面上的查询返回 null
【发布时间】：2020-05-22 22:13:58
【问题描述】：

我正在为 gatsby-transformer-remark 开发一个插件。在我的插件中，我从 Remark 转换器中获取数据并创建一个新类型的 graphql 节点。当我启动站点并在http://localhost:8000/___graphql 打开 GraphIQL 时，我可以看到我的插件的新节点及其数据。但是，当我尝试在 Gatsby 页面组件中访问该节点的数据时，graphql 查询为该节点类型返回 null。为什么数据没有出现在我页面的graphql查询中？我不能在 Remark 插件中创建新的 graphql 节点吗？ Remark gatsby 插件 API 提供了创建节点的必要方法。

我在这个链接上有一个最小的复制回购。运行它和查看问题的说明在自述文件中。

https://github.com/timothymcmackin/test-create-nodes

我使用createNode 方法在plugins/gatsby-remark-internal-toc/index.js 中创建graphQL 节点：

  if (headings.length > 0) {
    const { createNode } = actions;

    const headingNode = {
      headings: headings,
      path: markdownNode.frontmatter.path,
      id: createNodeId(`${markdownNode.frontmatter.path}.${markdownNode.frontmatter.title}`),
      children: [],
      internal: {
        description: `Headings and links for ${markdownNode.fileAbsolutePath}`,
        type: "topicInternalHeadings",
        contentDigest: createContentDigest(headings),
        content: JSON.stringify(headings),
      }
    };

    await createNode(headingNode);
  }

我使用 Gatsby develop 命令启动该站点。然后我打开 graphIQL 并运行这个查询：

query MyQuery {
  topicInternalHeadings(path: {eq: "/mypage.html"}) {
    headings {
      level
      path
      text
    }
  }
}

查询返回topicInternalHeadings 节点的数据。

然后我打开http://localhost:8000/myPage.html，上面有类似的查询。但是，它的查询结果是：

{markdownRemark: {…}, topicInternalHeadings: null}

预期结果

我在插件中创建的 graphql 节点数据可用于 Gatsby 页面上的 graphiql 和 graphql 查询。

实际结果

节点数据可用于 graphiql，但在 Gatsby 页面上的 graphql 查询返回 null。

【问题讨论】：

感谢您抽出宝贵的时间整理复制回购！不幸的是，我无法重现，topicInternalQuery 在我的 GraphiQL 中也是 null。可能是缓存问题，你可以试试gatsby clean 告诉我这是否解决了它？
奇怪——我跑了gatsby clean，然后跑gatsby develop，我在GraphiQL中看到了数据。不确定我们看到不同的结果会发生什么。不同版本的盖茨比？我已将 gatsby 更新到 2.19.12 和 gatsby-transformer-remark 2.6.50。我提交了我的 yarn.lock 文件，所以也许可以尝试使用它。

标签： graphql gatsby

【解决方案1】：

在我的情况下，我页面中的查询没有名称，所以取而代之的是：

 query {
   allMdx(sort: {fields: frontmatter___date, order: DESC}, limit: 6) {
  edges {
.....

这样做：

query SomeMeaningFulName {
   allMdx(sort: {fields: frontmatter___date, order: DESC}, limit: 6) {
  edges {

【讨论】：