hiro08gh

ソフトウェアに関すること

NetlifyにデプロイしたSPAがPage Not Foundを出してしまう問題

create-react-appで作ったプロジェクトにreact-router-domを入れて、シンプルなSPAを作ってNetlifyにデプロイしたところ、画面遷移はできるのですが、リロードするとPage Not Foundが出てしまうということがありました。その対処方法です。
今回の問題はcreate-react-appで作ったプロジェクトでの話なので、自前で作ったwebpackコンフィグファイルでのデプロイは検証していません。

解決策

プロジェクトフォルダ内のpublicフォルダに_redirectsファイルを作ります。そして、ファイルに追記します。

_redirects

/*    /index.html   200

上記のリダイレクトルールは、ブラウザが要求するURLに関係なく、404を与える代わりにindex.htmlを提供します。
リダイレクトルールの概要はこちらのドキュメントを参照してください。
www.netlify.com