如何在Gatsby中从单个json文件创建多个页面

Question

我是node.js的新手并做出反应，但我喜欢gatsby.js。我已经按照我能找到的所有教程进行了操作，这是一个非常棒的工具。

然而，我想要使用它的一个主要原因是我有一个包含1000个不同记录的文件json，我想为每条记录生成一个新页面。

我相信我已经得出结论，我需要了解更多有关gatsby-node.js文件的信息，并且我知道以下资源，但有关于此主题的任何教程或其他示例可能更容易理解：

https://www.gatsbyjs.org/docs/creating-and-modifying-pages/#creating-pages-in-gatsby-nodejs

Answer 1

你所指的例子应该已经给你一个好主意。基本概念是导入JSON文件，在其上循环并为JSON源中的每个项运行createPage。所以给出了一个示例源文件，如：

<子>的 pages.json

[{
  "page": "name-1"
}, {
  "page": "name-2"
}]

然后，您可以使用Node API为每个页面创建页面：

<子>的盖茨比-的node.js

const path = require('path');
const data = require('./pages.json');

exports.createPages = ({ boundActionCreators }) => {
  const { createPage } = boundActionCreators;

  // Your component that should be rendered for every item in JSON.
  const template = path.resolve(`src/template.js`);

  // Create pages for each JSON entry.
  data.forEach(({ page }) => {
    const path = page;

    createPage({
      path,
      component: template,

      // Send additional data to page from JSON (or query inside template)
      context: {
        path
      }
    });
  });
};