使用 Graphql 和 gatsby-source-filesystem 查询文件夹

Posted 2023-03-08

【中文标题】使用 Graphql 和 gatsby-source-filesystem 查询文件夹

【英文标题】：Query folder usign Graphql and gatsby-source-filesystem

【发布时间】：2020-11-14 19:55:30

【问题描述】：

编辑

我想我不清楚我的问题。

问题是 sourceInstanceName 正在返回问题中显示的空数组，即使该文件夹包含内容和 .md 文件。

大家好，我在使用 graphql 查询文件夹时遇到问题。

你看我有这个文件结构：

/content/posts/Journeys/FILENAME.EXTENSION
/content/posts/Blog/FILENAME.EXTENSION

我想查询文件夹名称（又名 Journeys 或 BLOG）而不是内容。

我可以使用这个查询：

query test2 
  journeys: allFile(filter: sourceInstanceName: eq: "posts") 
    edges 
      node 
        dir
        name
        relativePath
        relativeDirectory
      
    
  

返回这个，它返回不必要的文件，因为我只想要文件夹名称或目录：

  "data": 
    "journeys": 
      "edges": [
        
          "node": 
            "dir": "D:/Side-projects/salomonpina.dev/content",
            "name": ".git",
            "relativePath": ".git",
            "relativeDirectory": ""
          
        ,
        
          "node": 
            "dir": "D:/Side-projects/salomonpina.dev/content/icons/png",
            "name": "github-icon_512",
            "relativePath": "icons/png/github-icon_512.png",
            "relativeDirectory": "icons/png"
          
        ,

more info down...

它也适用于资产

但是当我将(filter: sourceInstanceName: eq: "posts") 更改为(filter: sourceInstanceName: eq: "journeys")

它返回一个空数组：

  "data": 
    "journeys": 
      "edges": []
    
  

即使它使用正确的名称，来自gatsby-source-filesystem 的名称。

这是我在gatsby-config.js 和gatsby-source-filesystem 中所做的。

      resolve: "gatsby-source-filesystem",
      options: 
        name: "posts",
        path: `$__dirname/content/`,
      ,
    ,

    
      resolve: "gatsby-source-filesystem",
      options: 
        name: "assets",
        path: `$__dirname/static/`,
      ,
    ,

    
      resolve: "gatsby-source-filesystem",
      options: 
        name: "journeys",
        path: `$__dirname/content/posts/Journeys/`,
      ,
    ,

我试过this solution，但似乎没有帮助。

任何帮助将不胜感激。

【问题讨论】：

你是指每个post的文件夹吗？

是的，每个帖子的文件夹名称

【参考方案1】：

缺少有关文件数据类型（扩展名）的信息，这会影响您应该如何收集post 信息。一旦您获得sourceInstanceName 直接访问内容本身的权限，您需要做什么。假设你有一个降价结构，这将是childMarkdownRemark，所以这应该可以工作：

  allFile(filter: sourceInstanceName: eq: "journeys") 
    edges 
      node 
        sourceInstanceName
        childMarkdownRemark 
          frontmatter 
            slug
          
        
      
    
  

注意：由于childMarkdownRemark 对象，您的嵌套结构可能与我的不同。检查localhost:8000/___graphql Playground，看看哪个是您的查询对象。

此外，我认为您的博客文件夹的 gatsby-node.js 中缺少一个文件系统：

  resolve: "gatsby-source-filesystem",
  options: 
    name: "blog",
    path: `$__dirname/content/posts/Blog/`,
  ,
,

如果您未从查询中检索到任何值，请删除 filter 以检查每个 post 的 sourceInstanceName 是什么（检查它们是否设置正确或过滤器是否因错字）。在localhost:8000/___graphql Playground 中查看它们。

---

我不知道您的要求或规范，但是，也许在您的 post GraphQL 架构中添加另一个字段也适合您，比如说 category（journey 或 blog）对于你，作为一个想法。

【讨论】：

感谢您的提醒！已添加博客文件夹和文件系统，但我想我不清楚我的问题。问题是 sourceInstanceName 正在返回问题中显示的空数组，即使该文件夹包含内容和 .md 文件

在这种情况下，我建议删除过滤器并尝试查询您所有的sourceInstanceName 并查看它们是否被很好地检索。然后我会尝试添加过滤。