Gatsby 如何使用 GraphQL 提供 Markdown frontmatter？

Posted 2023-03-08

【中文标题】Gatsby 如何使用 GraphQL 提供 Markdown frontmatter？

【英文标题】：How does Gatsby serve up Markdown frontmatter with GraphQL?

【发布时间】：2019-01-23 15:22:01

【问题描述】：

对我来说 Gatsby 最有趣的功能是 gatsby-source-filesystem 能够利用降价文件目录并通过 GraphQL 查询将静态内容提供给 React。本质上，带有 YAML frontmatter 的平面文件是可过滤的、可排序的、可嵌套的等。它是如何完成的？它是基于现有的方法吗？如果没有，是否可以将其提取以与其他堆栈一起使用？ （以 Vuepress 为例）

跟进：方法是 YAML 特定的吗？可以是 TOML 或 JSON 或 CSV 或或或...？

【问题讨论】：

如果这澄清了什么，我不确定apollo是否在做这项工作，或者它是否与webpack的yaml-loader或什么有关

【参考方案1】：

gatsby-source-filesystem 没有任何特定于 markdown 的逻辑，并且确实不负责拆分 frontmatter。这就是gatsby-transformer-remark 的工作，它使用grey-matter 进行实际的frontmatter 解析（source）。

使用 Gatsby 提供的 createNode 操作从那里创建节点。 Gatsby 根据节点的值推断类型。

【讨论】：

噢噢噢谢谢你，科里！灰质看起来非常漂亮。 createNode 需要更多的挖掘才能理解，但你让我走上了正确的道路。 :)