Gatsby入门指南—添加上一页下一页功能（完结篇）

忠彬老师

于 2019-05-31 10:55:03 发布

阅读量1.4k

点赞数

CC 4.0 BY-SA版权

分类专栏：原创前端进化岛文章标签： JavaScript web 前端 Gatsby

本文链接：https://blog.youkuaiyun.com/mianbaolixiang/article/details/90712376

前端进化岛同时被 2 个专栏收录

7 篇文章 ¥9.90 ¥99.00

订阅专栏

原创

18 篇文章

订阅专栏

本文介绍了如何在Gatsby中添加上一页和下一页功能，通过调整gatsby-node.js和blogPost.js，实现了Markdown文件自动生成网页。文章最后提供了作者的开源模板库链接，建议读者掌握基础以应对可能的定制需求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.调整gatsby-node

这个就简单了,打开gatsby-node.js，增加代码如下：

const path = require("path");
exports.createPages = ({ actions, graphql }) => {
  const { createPage } = actions
  const blogPostTemplate = path.resolve(`src/templates/blogPost.js`)
  return graphql(`
    {
      allMarkdownRemark {
        edges {
          node {
            frontmatter {
              path,
              title,
              tags
            }
          }
        }
      }
    }
  `).then(result => {
    if (result.errors) {
      return Promise.reject(result.errors)
    }
    const posts = result.data.allMarkdownRemark.edges;
    createTagPages(createPage, posts);
    posts.forEach((

了解本专栏