Routing not working in Vercel

React
1

I recently created a landing page after finishing Mosh’s latest React 18 course.

I deployed it in Vercel, Everything seemed to work fine. I added a new page today by installing the react-router and everything seemed to work great in my local env.

But When I deployed it in Vercel and checked the new page, I’m getting a 404 error. Not sure what I’m doing wrong.

This is the router file’s code

import { createBrowserRouter } from "react-router-dom";
import App from "../App";
import ThankYou from "../ThankYou";

const router = createBrowserRouter([
    { path: '/', element: <App />},
    { path: '/thankyou', element: <ThankYou />}
])

export default router;

This is from my vercel link

image
image2418×1708 151 KB

This is the home page - https://studyabroad.mugdhasmastersconsultancy.com/

And this is the new page i created recently - https://studyabroad.mugdhasmastersconsultancy.com/thankyou

2

Found the solution for this issue,

Thanks to this guy’s comment in stack overflow - reactjs - Vite.js React Build Not Redirecting On Netlify And Vercel - Stack Overflow

Created a file called “vercel.json” in the root directory of the project

And added this code

{
    "rewrites": [{ "source": "/(.*)", "destination": "/" }]
}

Voila :sunglasses: