- Published on
How to fix React Router issues on Vercel
- Authors
- Name
- Arnaud Ferrand
- @arferrand
Photo by Chloé Stein on Unsplash
Do you need help getting your React app's links to work correctly after deploying to Vercel? It happens when using React Router. Here's a quick fix!
Vercel allows you to set up rewrites using a file named vercel.json. Just create this file in your main project folder and add this code:
{
"rewrites": [{ "source": "/(.*)", "destination": "/index.html" }]
}
It tells Vercel to send any URL (web address) (represented by (.\*)) to your app's starting point, index.html. After making this change, redeploy to Vercel. That will solve your 404 problems and enable your app's internal links to work as expected.