Skip to main content
Kill -9 Club
Sign in

client-side routing and the index.html fallback

Web

In a Vite or React build, dist/ holds index.html, an assets/ folder and nothing else. /about is not a file: React Router invents it in the browser after index.html has loaded, by rewriting the address bar. So a visitor who opens https://example.com/about directly, or simply reloads that page, asks Nginx for a path that has never existed on disk. try_files $uri $uri/ =404 finds nothing and returns the 404, and the blame goes to the deployment, or to the router, which is working exactly as designed. A web server knows nothing about routes the browser invents. The fix is one term: try_files $uri $uri/ /index.html. Files that exist still win, and everything else gets the application, which reads the URL itself and renders the right view.

Also written: index.html fallback, history API fallback, SPA fallback, try_files /index.html