text: exports.createPages = async ({ actions: { createPage }, graphql }) => {
    // Create a page without any data
    createPage({
      path: "/no-data/",
      component: require.resolve("./src/templates/no-data.js"),
    })
    // Create a page with hard-coded data
    createPage({
      path: "/page-with-context/",
      component: require.resolve("./src/templates/with-context.js"),
      context: {
        title: "We Don’t Need No Stinkin’ GraphQL!",
        content: "<p>This is page content.</p><p>No GraphQL required!</p>",
      },
    })
    // Create pages from JSON with images
    const products = require("./data/products.json")
    products.forEach(product => {
      createPage({
        path: `/product/${product.slug}/`,
        component: require.resolve("./src/templates/product.js"),
        context: {
          title: product.title,
          description: product.description,
          image: product.image,
          price: product.price,
        },
      })
    })
    // Generate pages with GraphQL
    const results = await graphql(`
      {
        allProductsJson {
          edges {
            node {
              slug
            }
          }
        }
      }
    `)
  
    results.data.allProductsJson.edges.forEach(edge => {
      const product = edge.node
      // slug は context 内で渡すだけなので、テンプレートコンポーネントでこれを使用してより多くの商品データを読み込むことができます。
      createPage({
        path: `gql/${product.slug}/`,
        component: require.resolve("./src/templates/product-graphql.js"),
        context: {
          slug: product.slug,
        },
      })
    })
  }
  