我想使用 gatsby.js 和 strapi v3 创建分页。但是我得到一个错误，无法做到。 gatsby-awesome-pagination

Question

https://blakey.co/blog/pagination-with-strapi-and-gatsby 我从该站点复制并粘贴了代码。

我的 strapi collection 是 Post，类别

allStrapiArticle ⇨ allStrapiPost

我完全按照本页所示进行制作。但是，我收到以下错误

ERROR #11325 Your site's "gatsby-node.js" created a page with a component that doesn't exist.
The path to the missing component is "/Users/t/WebDevelopment/xxxxx/src/templates/article.js" The page object passed to createPage: { "path": "/blog/ukraine-national-guards-man-shoots-up-weapons-factory", "component": "/Users/t/WebDevelopment/xxxxx/src/templates/article.js", "context": { "id": "Post_2", "slug": "ukraine-national-guards-man-shoots-up-weapons-factory" } }

See the documentation for the "createPage" action — https://www.gatsbyjs.com/docs/reference/config-files/actions#createPage

not finished createPages - 0.036s

npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR!
surprise_movie@1.0.0 develop: gatsby develop npm ERR! Exit status 1
npm ERR! npm ERR! Failed at the surprise_movie@1.0.0 develop script.
npm ERR! This is probably not a problem with npm. There is likely
additional logging output above.
npm ERR! A complete log of this run can be found in: npm ERR!
/Users/t/.npm/_logs/2022-02-01T07_06_11_359Z-debug.log

文件结构 [![在此处输入图片描述][1]][1]

gatsby-node.js

const path = require(`path`)
const { paginate } = require('gatsby-awesome-pagination');

const makeRequest = (graphql, request) =>
  new Promise((resolve, reject) => {
    resolve(
      graphql(request).then(result => {
        if (result.errors) {
          reject(result.errors)
        }

        return result
      })
    )
  })

exports.createPages = ({ actions, graphql }) => {
  const { createPage } = actions

  // Get our articles
  const getPost = makeRequest(
    graphql,
    `
    {
      allStrapiPost{
        edges {
          node {
            id
            slug
          }
        }
      }
    }
    `
  ).then(result => {
    // Create pages for each article.
    result.data.allStrapiPost.edges.forEach(({ node }) => {
      createPage({
        path: `/blog/${node.slug}`,
        component: path.resolve(`src/templates/article.js`),
        context: {
          id: node.id,
          slug: node.slug,
        },
      })
    })

    // Create pagination
    paginate({
      createPage, 
      items: result.data.allStrapiPost.edges, 
      itemsPerPage: 5, 
      pathPrefix: '/archives', 
      component: path.resolve('src/templates/blog-archive.js')
    })
  })

  // Query for articles nodes to use in creating pages.
  return getPost
}

Answer 1

错误相当self-explanatory:

ERROR #11325 Your site's "gatsby-node.js" created a page with a
component that doesn't exist. The path to the missing component is
"/Users/t/WebDevelopment/xxxxx/src/templates/article.js"

您在 src/templates/article.js 中没有任何名为 article.js 的模板。您只有一个名为 blog-archive.js.

的文件

如果这是假定的模板文件，只需将 gatsby-node.js 中的 src/templates/article.js 更改为 src/templates/blog-archive.js。否则，如果文件丢失，您将需要创建一个新文件。

当 copying/pasting 时要小心，尝试了解您正在做什么以预测这些问题。

我想使用 gatsby.js 和 strapi v3 创建分页。但是我得到一个错误，无法做到。 gatsby-awesome-pagination

I want to use gatsby.js and strapi v3 to create pagination. But I get an error and can't make it. gatsby-awesome-pagination

gatsby