[2675] Naming routes

Hey everyone,

As I couldn't see any other issues just by a quick scan through the other issues, I created a new one. If this is a possible dupe, then I'd like a point in the right direction.

In "regular" Vue, I'm able to name my vue-router routes by using this scheme:

const index = require('~/pages/index.vue')
const page2 = require('~/pages/page2.vue')
const page3 = require('~/pages/page3.vue')

const routes = [
    { path: '/', component: index, name: 'Page 1' },
    { path: '/page2', component: page2, name: 'Page 2' },
    { path: '/page3', component: page3, name: 'Page 3' }
]

But since Nuxt generates the routes, and thus the route names, I'm unable to "harness" the power of this.$route.name, as I'm using this as a "page title" in a toolbar like this:

<tool-bar>
  <div class="page-title"><h1>{{ this.$route.name }}</h1></div>
</tool-bar>

However, in Nuxt this is the same name as the filename.

I have tried "underscoring" all the pages so the Nuxt build won't generate their routes, and then creating them myself inside nuxt.config.js, however that doesn't work. Especially "killing" index.vue will blow the app up.

I have also tried naming each route through extendedRoutes(), also with no luck.

Is there an easier way to display a customized title for each page?