Nogn provides a Pager component based off of the native Gridsome Pager component. The eventual hope will be to not need this custom component.

Install the component in your category template or page

<template>
  <div>
    <!-- other template code -->
    <Pager :info="$context.nognPageInfo" />
  </div>
</template>

<script>
import Pager from '@nogn/gridsome-source-craft/dist/Pager'

export default {
  components: { Pager }
}
</script>

Pagination in a src/pages/ file

Note the use of the limit and nognOffset

<page-query>
query ($nognOffset: Int = 0) {
  craft  {
    entries (limit: 2, offset: $nognOffset) {
      # examples of whatever fields are needed
      id
      title
    }
  }
}
</page-query>

Pagination in a src/template category file

Note the use of $uid, $id and $nognOffet

<page-query>
query ($uid: [String], $id: [Int], $nognOffset: Int = 0) {
  craft {
    category (uid: $uid) {
      # examples of whatever fields are needed
      id
      title
    }
    entries (relatedTo: $id, limit: 10, offset: $nognOffset) {
      # examples of whatever fields are needed
      title
    }
  }
}
</page-query>

Component arguments

These follow the conventions of the Gridsome Pager component