gridsome where to add router meta data

Question

I want to password protect specific routes and would like to add a meta data to every route like this:

{
  path: '/route-path',
  name: 'route-name',
  component: ComponentName,
  meta: {
    requiresAuth: true
  }
}

So I can check this in

router.beforeEach((to, from, next)

I have access to router.beforeEach in main.js but where do I add the auth flag to each route? gridsome.config.js does not seem to work?

Answer 1

Although it's not currently documented you can use the create page API and pass it a route property, for example...

src/pages.js

module.exports = [
  {
    path: '/',
    route: {
      name: 'index',
      meta: {
        requiresAuth: false
      }
    },
    component: './src/views/Index.vue'
  }
]

gridsome.server.js

const pages = require('./src/pages')

module.exports = function (api) {
  api.createPages(({ createPage }) => {
    for (const page of pages) {
      createPage(page)
    }
  })
}

I also moved the page components into a src/views directory to avoid route auto generation.