webpack.config.js 内の
devServer.historyApiFallback: true
を設定してあげるとうまくいく。
devServer.historyApiFallback ついて
devServer.historyApiFallback について SPA は、サーバー上のパスは 1 ページで完結しているので、読み込ませたい JavaScript のパスを指定すると、
404 エラー(React の場合は Cannot GET /foo
)が出力される。
そうなった際に、History で内部的に Routing で指定されたパスをリクエストしたという履歴を残しつつ、index.html を表示することで、指定された Routing へのリクエストがあったとしてコンポーネントを読み込ませる制御をしているようなイメージ。
参考