用途：Gatsby 是基于 React 的静态站点生成框架，适合构建静态营销网站、博客、文档站以及无头 CMS 前端，通过预渲染实现 SEO 与快速加载。
主要能力：提供 GraphQL 数据层，可在构建时查询站点元数据与 CMS 内容（如 Contentful、Sanity、Strapi、WordPress）；支持 useStaticQuery 与页面查询；可通过 gatsby-node.ts 的 createPages 动态生成页面；Head API 用于设置页面 head 内容；gatsby-plugin-image 提供 StaticImage 与 GatsbyImage，自动生成响应式 WebP/AVIF 图片与模糊占位；支持 Deferred Static Generation（DSG）加速构建，以及通过 gatsby-plugin-manifest 和 gatsby-plugin-offline 实现 PWA。
使用方式：在 src/pages 下创建 React 页面组件，使用 graphql 标签查询数据；在 gatsby-node.ts 中编写 createPages 生成动态路由；图片使用 StaticImage 或 GatsbyImage 组件；配置使用 gatsby-config.ts。
适用场景：静态营销网站与博客、无头 CMS 前端、高性能图片优化、基于 MDX 与 Algolia 搜索的文档站。
限制与注意：避免对本地资源使用标准 img 标签；避免在客户端请求可在构建时通过 GraphQL 获取的数据；列表查询中只取 excerpt 与 frontmatter 字段；构建时访问 window 或 document 会报错，需用 typeof window !== "undefined" 保护；GraphQL 字段不存在时可在 GraphiQL（http://localhost:8000/___graphql）验证；缓存损坏时可运行 gatsby clean 后重建。