I'm trying to pass routes to my Next.js app but it's returning an error, I've looked everywhere but I can't find the answer.
_App.tsx
import Routes from './Routes'
function MyApp({ Component, pageProps }: AppProps) {
return (
<Index/>
)
}
export default MyAppRoutes.tsx
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'
import { SideBar } from './components/sideBar'
const Routes = () => {
return (
<div className={styles.container}>
<Router>
<Routes>
<Route path='/' element={<SideBar />}/>
</Routes>
</Router>
</div>
)
}
export default RoutesMy error:
ReferenceError: document is not defined
you can Routes like this
<BrowserRouter>
<Routes>
<Route path="/" element={< Home />} />
<Route path="/yourComponentsPage" element={< yourComponent/>} />
</Routes>
</BrowserRouter>
regards