enfrancais-app/src/router/routes.js

import Home from '@/pages/Home'
import TextOptions from '@/pages/_partials/TextOptions'


export default [
  {
    name: 'home',
    path: '/',
    component: Home
  },

  {
    name: 'library',
    path: '/library',
    components: {
      default: () => import(/* webpackChunkName: "library" */ '@/pages/Library'),
      options: TextOptions
    },
    props: {
      default: ({ query }) => ({
        mode: query.mode || 'tree-map',
        // In case of a reload or direct link, vue-router doesn't turn the query string into an array.
        texts: query.texts && query.texts.length && typeof query.texts[0] === 'string'
          ? query.texts.map(text => text.split(',').map(id => parseInt(id)))
          : query.texts
      }),
      options: ({ query }) => ({
        show: !('texts' in query)
      })
    }
  },

  {
    name: 'kit',
    path: '/kit',
    component: () => import(/* webpackChunkName: "kit" */ '@/pages/Kit')
  },

  {
    name: 'gallery',
    path: '/gallery',
    component: () => import(/* webpackChunkName: "gallery" */ '@/pages/Gallery')
  },

  {
    name: 'blog',
    path: '/blog',
    component: () => import(/* webpackChunkName: "blog" */ '@/pages/Blog')
  },

  {
    name: 'notfound',
    path: '/404',
    alias: '*',
    component: () => import(/* webpackChunkName: "404" */ '@/pages/NotFound.vue')
  }
]