[Bug]: <Outlet/> not working in build production with Vite. about react-router

[brophdawg11]

Yeah my guess is this is due to the bad rollup version - please ensure vite is using the latest version of rollup and the issue should be resolved (see the comments in #11480 for how to do this). Closing this as a duplicate.

[mohammad-aljamil]

solved in #11480 (comment)

[brophdawg11]

Could you provide a minimal reproduction of the issue?

[vladimir-theunit]

Could you provide a minimal reproduction of the issue?

Routing.tsx, all this code is inside
`
import { FC, lazy } from "react";
import { Navigate, Route, Routes, RouteProps } from "react-router-dom";
import { LazyPage, PrivateRoute } from "@/routes";
import { LoginPage, NotFoundPage } from "@/pages";
import { RoutersEnum } from "@/enums";
import Layout from "@/layouts/Layout";

// Import dynamic pages here
const HomePage = LazyPage(lazy(() => import("@/pages/Home")));
const PromotionsPage = LazyPage(lazy(() => import("@/pages/Promotions")));
const SocialAreaPage = LazyPage(lazy(() => import("@/pages/SocialArea")));
const GamesPage = LazyPage(lazy(() => import("@/pages/Games")));

const routes: RouteProps[] = [
{ path: RoutersEnum.PROMOTIONS, element: },
{ path: RoutersEnum.SOCIAL_AREA, element: },
{ path: RoutersEnum.GAMES, element: },
] as const;

const Routing: FC = () => {
return (

<Route element={} path={RoutersEnum.LOGIN} />
<Route element={} path={RoutersEnum.SIGN_UP} />
<Route path="/" element={}>
<Route
index
element={
<>


</>
}
/>
<Route element={}>
{routes.map((route) => {
return <Route key={route.path} {...route} />;
})}

<Route path="*" element={} />
<Route path="/404" element={} />


);
};

export default Routing;
`

After reaching the home page, I only see the layout without the homepage content, but inside the layout, the PrivateRoute contains the Outlet, so don't worry.

After downgrading the version of react-router-dom, all my routes work as expected, as I mentioned in the previous message. While debugging, I noticed that the Outlet isn't functioning in latest version.

I'm using Vite and React with TypeScript. The router only fails to work when I build for production and preview it.