どーも、ぐるたか@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.jsにgenerateにsubFolders: falseを設定すると、リロード後にURLが閲覧できなくなるので、絶対にしないように!
https://ja.nuxtjs.org/docs/2.x/configuration-glossary/configuration-router/#trailingslash
https://knote.dev/post/2020-03-19/nuxt-trailing-slash/
この方が紹介しているようにtrailingSlashではダメなのでしょうか?
(常にfirebase使うとは限らないので汎用的な方法が良いかなぁと思って質問してみました)
コメント、ありがとうございます。
仰る通り、
trailingSlashを使うのがベストです。この記事を執筆していた当時(だいぶバージョンが古いとき)、
trailingSlashでは思うように動かなったときの対応策になります。もし
trailingSlashで OK であれば、trailingSlashをお使いくださいませm(_ _)m