Gatsby의createPages가 캐시되고 다음 글의 링크 등 업데이트되지 않은 문제를 처리하는 워크스테이션

문제점

최근 Gatsby는 3.1.0으로 웹 사이트를 구축해 GiitHub의 창고와 연합해 Vercel 위탁 관리로 블로그를 공개했지만 Gatsby가 블로그를 구축할 때 각 보도의 꼬리에'다음','전면'등의 링크를 붙이고 싶었다.이것들도 gatsby-starter-blog 등 스타들 중에서gatsby-node에 포함된다.js에서 정의한createPages는 구축할 때 생성됩니다.
본래 링크의 생성은 새로운 글의 추가와 과거 글의 삭제에 따라 달라지므로 구축할 때 업데이트될 것으로 기대된다.그러나 신규 기사를 추가할 때는 이전 기사에서 다음 기사로 링크가 추가되지 않는 현상이 종종 발생한다.
당초 Vercel 측 캐시를 의심했는데 게이츠 by의 Issue#26520에 제목과 같은 Gatsby 주체의createPages 캐시가 완전히 같은 현상을 보고했다.이 문제는 이 글을 쓸 때도 수정되지 않았지만 업무에 대한 건의가 기재되어 있기 때문에 여기서 소개하겠습니다.

작업 제안

피에씨여기.가 공개됐기 때문에 알겠습니다. 확인해 주세요.내가 먼저 내가 한 일을 총결해 보겠다.

gatsby-node.js에 작업 반사 함수 추가

gatsby-node.js에 다음과 같은 내용을 보충합니다.평론을 포함해서 모두 피에의 것과 같다.
gatsby-node.js

exports.createResolvers = ({ createResolvers }) => {
  createResolvers({
    Query: {
      contextChangeNotInvalidingQueryWorkaround: {
        type: `JSON`, // type actually doesn't matter - we will return/resolve `null` anyway
        args: {
          path: {
            type: `String!`,
          },
        },
        resolve: async (_source, args, context) => {
          // Lookup SitePage node for current page.
          // This will register SitePage node as dependency of the query.
          // Changing context does change SitePage, so it will invalidate
          // query result properly.
          await context.nodeModel.runQuery({
            query: {
              filter: {
                path: { eq: args.path },
              },
            },
            type: `SitePage`,
            firstOnly: true,
          })

          return null
        },
      },
    },
  })
}

템플릿의graphiql 조회에 작업 알림 추가

createPages에서 부르는 각 템플릿의 검색에 추가$path: String!하고 상기 작업 알림용 함수를 호출합니다.여기에 제 코드를 인용했기 때문에 무관한 내용도 포함되어 있으니 적당히 다시 읽어 주십시오.
src/templates/blog-post.js

export const pageQuery = graphql`
  // *追加* query に $path: String! を追加
  query($slug: String!, $path: String!) {
    site {
      siteMetadata {
        title
        author
      }
    }
    mdx(fields: { slug: { eq: $slug } }) {
      id
      excerpt(pruneLength: 160)
      frontmatter {
        title
        date(formatString: "YYYY/MM/DD")
        tags
      }
      body
    }
    // *追加* ワークアラウンド用関数呼び出しを追加
    _: contextChangeNotInvalidingQueryWorkaround(path: $path)
  }
`

:::messages
'이전','다음'의 링크뿐만 아니라 매달 압축 파일 페이지 등도createPages에서 템플릿을 호출하여 생성하는 경우 각 템플릿은 상기 대응이 필요하다.
:::

기타

워크스테이션이 적용되었기 때문에내 웹 사이트 링크 등이 적절하게 업데이트되었는지 확인했습니다.이유는 자세히 설명하지 않았기 때문에 자세한 상황을 알고 싶으신 분들은 상기 이슈에서 관련 홍보를 찾아보세요.