无法在 allMarkdownRemark graphql 上查询字段

Posted 2023-03-08

【中文标题】无法在 allMarkdownRemark graphql 上查询字段

【英文标题】：Cannot query fields on allMarkdownRemark graphql

【发布时间】：2021-04-10 01:10:27

【问题描述】：

目标

嗨。我有一个 Gatsby 网站，我正在使用 gatsby-transformer-remark 插件将博客降价文件从博客目录加载到 GraphQL 中以显示在我的网站上。我查看了文档和示例代码，了解如何为每个页面创建一个 slug，以便在 gatsby-node.js 文件中我可以动态创建带有 slug 的页面。

问题

当我尝试访问 GraphiQL 中的 fields slug 属性时，我收到以下错误： message": "Cannot query field \"fields\" on type \"MarkdownRemark\"." 我已经检查了几次我的设置，我认为这一切似乎都很好，所以我不能 100% 确定我错过了什么没有这些字段。我可以访问其他信息，例如降价文件的原始内容和前端数据，但不能访问字段。

代码

在我的 gatsby-config.js 插件中，我对源文件系统和备注插件进行了以下设置

    
      resolve: `gatsby-source-filesystem`,
      options: 
        name: `blog`,
        path: `$__dirname/blog`,
      ,
    ,
    
      resolve: `gatsby-transformer-remark`,
      options: 
        plugins: [
          
            resolve: `gatsby-remark-images`,
            options: 
              maxWidth: 960,
            ,
          ,
          `gatsby-remark-prismjs`,
          `gatsby-remark-copy-linked-files`,
        ],
      ,
    ,

进入 GraphiQL 后，我会运行以下查询来复制错误

query 
  allMarkdownRemark(
          sort:  fields: [frontmatter___date], order: DESC 
          limit: 1000
        ) 
    edges 
      node 
        fields 
          slug
        
        frontmatter 
          title
        
      
    
  

【参考方案1】：

如您所见，slug 字段不是frontmatter 的子字段（如果您使用原始降价，本机应该如此）。要使slug 作为field 的子级可用，您需要在gatsby-node.js 中添加以下sn-p：

const  createFilePath  = require(`gatsby-source-filesystem`)

exports.onCreateNode = ( node, getNode, actions ) => 
  const  createNodeField  = actions
  
  if (node.internal.type === `MarkdownRemark`) 
    const slug = createFilePath( node, getNode, basePath: `pages` )
    createNodeField(
      node,
      name: `slug`,
      value: slug,
    )
  

使用createNodeField API 添加此配置，您将允许 Gatsby 和推断的 GraphQL 模式在由其他插件创建的节点上创建附加字段，方法是告诉 Gatsby 如果节点类型是降价，则创建一个 slug 字段基于frontmatter 的 slug 值。

您可以在Gatsby's docs查看更多信息。

【讨论】：

非常感谢，我知道这将是一件小事，错过了。让我难过一阵子