Nuxt.jsでのルートパスのテンプレートをindex.vueからtop.vueに変更する

編集するファイルは、.nuxt/route.js

router.jsのファイルを開いてみると、以下のような記述があると思います。

router.js

export const routerOptions = {

・・・・

  routes: [{
    path: "/top",
    component: _702885f1,
    name: "top"
  }, {
    path: "/",
    component: _2458d5ee,
    name: "index"
  }],

Nuxt.jsはディレクトリ構造でパスを決定する仕組みになっていますが、実はその設定はここに記載されています。

一番下で、ルートパスがindex.vueを参照するようにデフォルトで設定されてます。

この部分を書き換えてやれば、完了です。

router.js

export const routerOptions = {

・・・・

  routes: [{
    path: "/top",
    component: _702885f1,
    name: "top"
  }, {
    path: "/",
    component: _2458d5ee,
    name: "top" // 変更
  }],

僕の場合、ルートパスで、top.vueを参照して欲しいので上記のように変更しました。