7、在Gatsby中进行数据获取、查询与模板创建

在Gatsby中进行数据获取、查询与模板创建

一、数据获取与查询

在Gatsby项目中，我们可以从多种来源获取和查询数据，例如siteMetadata、Markdown、MDX以及各种CMS。下面以GraphCMS和Prismic为例进行说明。

1. GraphCMS示例

在页面查询中，可以将新的查询附加到现有的页面查询中，捆绑在同一个GraphQL字符串中。示例代码如下：

export const query = graphql`
  {
    mdx(frontmatter: { type: { eq: "bio" } }) {
      body
    }
    graphCmsIcebreaker {
      hobbies
    }
  }
`;

然后解构 data 属性来获取 hobbies 数组。

2. Prismic集成步骤

Prismic是GraphCMS的竞争对手之一，它提供动态多会话预览功能。以下是将Prismic集成到Gatsby项目中的具体步骤：
1. 在 /src 目录下创建一个名为 schemas 的文件夹。
2. 访问Prismic的网站（prismic.io）并登录，使用免费计划创建一个新的存储库。
3. 点击“Create your first custom type”按钮，选择单类型，将类型命名为