リロード後にスラッシュがつかないよう、GenerateしたNuxt製アプリをFirebase Hostingにデプロイする

どーも、ぐるたか@guru_takaです。

初期設定のまま、プリレンダリングしたNuxt製アプリをFirebase Hostingにデプロイすると、リロード後にURL末尾にスラッシュがついてしまいます。

■遷移時
~~~~~~~~~~~/sample

■リロード後
~~~~~~~~~~~/sample/

リロードしてもスラッシュがつかないように設定する方法を紹介します。

解決策

firebase.json"trailingSlash": falseを入れましょう。

firebase.json
{
  "hosting": {
    "public": "dist",
    "trailingSlash": false,
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}
注意
nuxt.conifg.jsgeneratesubFolders: falseを設定すると、リロード後にURLが閲覧できなくなるので、絶対にしないように!

最後に

参考 ホスティング動作を構成する | Firebase 参考 API: generate プロパティ - NuxtJS

2 COMMENTS

ぐるたか

コメント、ありがとうございます。

仰る通り、trailingSlash を使うのがベストです。

この記事を執筆していた当時(だいぶバージョンが古いとき)、trailingSlash では思うように動かなったときの対応策になります。

もし trailingSlash で OK であれば、trailingSlash をお使いくださいませm(_ _)m

コメントを残す