Pagination is creating multiple HTML files, but with the same content on each one

[philwolstenholme]

I'm using Eleventy 2.0.0-canary.18 and the Vue plugin 0.7.4. My whole package-lock.json is here.

I'm trying to split https://wolstenhol.me/github-stars up into multiple pages showing 15 items per page. It's using some global data as the source.

You can see how the file is set up here: https://github.com/philwolstenholme/wolstenhol-11ty/blob/github-star-pagination/src/github-stars.vue:

<template>
  <article>
    <!-- … -->
    <PwGitHubStars :stars="pagination.items"></PwGitHubStars>
    <p>This is page {{ pagination.pageNumber }}</p>
     <!-- … -->
  </article>
</template>

<script>
import PwGitHubStars from './includes/pw-git-hub-stars.vue';
export default {
  data: {
    layout: 'page',
    title: 'Github stars',
    seo: {
      description: `Partly for me to big up great projects, and partly as a set of things to check out later.`,
      changeFreq: 'weekly',
    },
    // eleventyNavigation: { key: 'github-stars' },
    pagination: {
      data: 'githubStars',
      size: 15,
    },
    permalink(data) {
      const parts = [data.page.filePathStem];
      const pageNumber = data.pagination.pageNumber + 1;
      if (pageNumber === 1) {
        return `${parts.join('.')}/index.html`;
      }
      return `${parts.join('.')}/${pageNumber}.html`;
    },
  },
  components: { PwGitHubStars },
};
</script>

Eleventy is creating files with the right filenames, but they all have identical content. pagination.pageNumber is 0 for all of them:

• https://deploy-preview-37--cranky-mcnulty-01683e.netlify.app/github-stars/
• https://deploy-preview-37--cranky-mcnulty-01683e.netlify.app/github-stars/2
• https://deploy-preview-37--cranky-mcnulty-01683e.netlify.app/github-stars/3

etc…

If this isn't a user error on my part then I think this might possibly be a Vue plugin issue rather than an Eleventy issue, because if I stick the below content into a github-starz.njk file then the output is as I'd expect (different items on each page):

---
title: Github stars
pagination:
  data: githubStars
  size: 12
---

{%- for item in pagination.items %} - [{{ item.name }}]({{ item.url }}) {%- endfor %}

Can anyone see what I'm doing wrong? A branch demoing the problem can be found here but you won't be able to build it, unfortunately (it relies on a bunch of local environment variables that I can't share, API keys etc).