Hi All,
Recently, while working on my AEM project, I encountered an unexpected issue after upgrading the react-router-dom dependency from version 5.3.4 to 6.22.0 in a remote Single Page Application (SPA) setup.
Issue Description:
After updating the react-router-dom dependency, I made the necessary changes in the app.js file of my AEM project. Specifically, I replaced the <Switch> component with the <Routes> component as Switch is not supported in react-router-dom version 6.
// Before:
<Switch>
<Route path="/"> <Home /> </Route>
</Switch>
// After:
<Routes>
<Route path="/" element={<Home />} />
</Routes>
However, after making this change, I noticed that the AEM home page started rendering as a blank page as shown in the below image while the react page continued to work as expected.
![Mukesh42_1-1709106721016.png Mukesh42_1-1709106721016.png](https://experienceleaguecommunities.adobe.com/t5/image/serverpage/image-id/70726i86D9392E77D4F001/image-dimensions/804x406?v=v2)
Is there any way to fix this issue? Any help will be appreciated. Thanks.