使用gatsby和内容丰富的CreatePage API的问题未显示内容

如何解决使用gatsby和内容丰富的CreatePage API的问题未显示内容

我正试图从内容丰富的目录中生成每个类别数据的页面。 但有一些担忧。

成功

• 我本可以从首页（localhost：8000）上内容丰富的..如（标题，图像等）获得数据

失败

• 当我单击“更多信息”按钮时，“ Card”位于（localhost：8000）上，并切换到另一页（“ localhost：8000 / blog / tech /（我在内容上创建的内容）”）失败，并且出现了404页（唯一的炉渣已经改变并希望出现）。

错误

warn The GraphQL query in the non-page component "C:/Users/taiga/Github/Gatsby-new-development-blog/my-blog/src/templates/blog.js" will not
Exported queries are only executed for Page components. It's possible you're
trying to create pages in your gatsby-node.js and that's failing for some
reason.

If the failing component(s) is a regular component and not intended to be a page
component,you generally want to use a <StaticQuery> (https://gatsbyjs.org/docs/static-query)
instead of exporting a page query.

我的仓库

enter link description here

gatsby.node.js

    const path = require(`path`);
    
    const makeRequest = (graphql,request) => new Promise((resolve,reject) => {
     // Query for nodes to use in creating pages.
     resolve(
       graphql(request).then(result => {
         if (result.errors) {
           reject(result.errors)
         }
         return result;
       })
     )
    });
    
    // Implement the Gatsby API "createPages". This is called once the
    // data layer is bootstrapped to let plugins create pages from data.
    exports.createPages = ({ actions,graphql }) => {
     const { createPage } = actions;
    
    // Create pages for each blog.
     const getBlog = makeRequest(graphql,`
       {
         allContentfulBlog (
          sort: { fields: [createdAt],order: DESC }
          )
           edges {
             node {
               id
               slug
             }
           }
         }
       }
       `).then(result => {
       result.data.allContentfulBlog.edges.forEach(({ node }) => {
         createPage({
           path: `blog/${node.slug}`,component: path.resolve(`src/templates/blog.js`),context: {
             id: node.id,},})
       })
    });

const getTech = makeRequest(graphql,`
{
  allContentfulBlog (
    sort: { fields: [createdAt],order: DESC }
    filter: {
       
      categories: {elemMatch: {category: {eq: "tech"}}}
    },)
  {
    edges {
      node {
        id
        slug
      }
    }
  }
}
`).then(result => {
  const blogs = result.data.allContentfulBlog.edges
  const blogsPerPage = 9
  const numPages = Math.ceil(blogs.length / blogsPerPage)

  Array.from({ length: numPages }).forEach((_,i) => {
    createPage({
      path: i === 0 ? `/category/tech` : `/category/tech/${i + 1}`,component: path.resolve("./src/templates/tech.js"),context: {
        limit: blogsPerPage,skip: i * blogsPerPage,numPages,currentPage: i + 1
      },})
  })
});

 return Promise.all([
   getBlog,getTech
  ])
};