React-Router v6 でのルーティングが本番環境で機能しない【403エラー】

はじめに

原因はとても恥ずかしながら筆者のファイル構成のせいでした。かなり少ないケースだと思いますが自戒と備忘録を兼ねて記事にしていきます。
ちなみに技術に関しては、React,TypeScript,Viteで国内ホスティング会社へのセルフホストという内容です。

原因

画像など素材管理用フォルダ（ディレクトリ）名とリンク（ルーティング）先の文字列（gallery）を同じにしていたため。
画像など各種素材は静的アセットとしてpublicディレクトリ内にgalleryディレクトリを作ってその中に入れていました。

public
|-gallery

開発環境ではpublicからのファイルパス（public/gallery）で機能していたのですが、本番環境（ビルドした後のdist）ではリンク先ページとして意図したgallery（ページ）ではなく、素材管理用フォルダであるgalleryにアクセスする記述となってしまっていたので403エラーが出る事態になっていたのです。

さいごに

まぁこのような恥ずかしいことは筆者だけでしょうが、実体験として「制作中やデバック中などは自分が思っている以上に視野が狭くなりがち」という現象を思い知らされました。
トラブル対応している時ほど、いつも以上に冷静に一歩下がって俯瞰して物事を捉えるのが大事なのでしょうね（言わずもがな筆者はまだまだですが）。

ここまで読んでいただき、ありがとうございました！