どーも、ぐるたか@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