Gitの設定のせいでGatsbyのルーティングにハマった
背景
このブログはGatsbyJSで作っており、先日コードのTypeScript化をおこなった。
元々タグ一覧ページ用のファイル名をsrc/pages/tags.jsとしていたが、TypeScript化するにあたってsrc/pages/Tags.tsxという名前にしてコミットした。
その後、Gatsbyはsrc/pages配下のファイル名から自動でルーティングを生成することを知り、ファイル名をsrc/pages/tags.tsxに修正した(/tagsでタグ一覧ページにアクセスしたかった)。
ローカルでの動作に問題はなかったのでそれをコミットし、Githubにプッシュ、Netlifyでデプロイした。
しかし、本番環境で動作をチェックしてみると、/tagsページに遷移しても何も表示されなくなってしまっていた。
原因と対応
gatsby-configやNetlifyの設定など色々確認したがなかなか原因が分からず苦労した。
結果として原因は以下のGitの設定によるものだった。
Gitはデフォルトではファイル名の大文字・小文字の変更を検知しないようになっている。
以下のコマンドからファイル名の大文字・小文字の変更を検知するように設定できる。
git config --global core.ignorecase false
.gitconfigを直接編集する際はこちら。
[core]
ignorecase = false
つまり、今回の場合はTags.tsx -> tags.tsxの変更がGitで検知されておらず、GithubとNetlifyにはTags.tsxのファイル名のままでコミットされていたということだった。
おわり
Gitの設定はまだまだ奥深い。主要な設定は一通り目を通しておこうと思った。