为什么我的 Gatsby.js 构建会为每个帖子生成重复数据？

Question

我的 gatsby.js 网站基于 egghead.io 使用的 repo：gatsby-starter-egghead-blog

当我运行 gatsby build 命令时，会生成以下文件结构（我省略了 404 和索引文件夹）

对于我的“内容”文件夹中的每篇博客文章，我都会生成 2 个文件夹，每个文件夹与博客文章的名称相同。 “public”下的一个包含一个 html 文件，“page-data”下的一个包含一个 json 文件，该文件包含与 html 文件中呈现的内容完全相同的内容，但不包括任何 CSS 样式。

为什么我已经有了静态 html 文件时这些 json 文件仍然存在？基本上我得到了重复的数据。

Answer 1

我想我刚刚找到了答案。

Gatsby.js 遵循PRPL 模式。

您访问的任何 Gatsby 网站的第一个页面都会加载一个静态 HTML 页面。任何后续页面访问的行为更像是 SPA。如果您在浏览 Gatsby 网站时观看 Chrome 中的网络选项卡，就会看到这一点。首先加载 HTML 页面，然后在浏览网站时从 page-data.json 文件加载页面。

Gatsby 对这种模式的实现进行了更详细的描述here。

这解释了为什么每个页面的数据在 Gatsby 网站中存在两次 - 作为第一次加载时呈现的静态 HTML 和要动态加载的原始 JSON 数据。