Routing not working in Vercel

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

This is the home page -

And this is the new page i created recently -

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: