There is a problem with the react routing version. Check the package JSON file, check the version of react router dom. If it is version 6, this problem will occur.
In the V6 version of react router, route has changed its usage.
import React from "react"
import Home from "./pages/home"
import Mine from "./pages/mine"
import {BrowserRouter, Routes, Route} from 'react-router-dom'
function App() {
return (
<div className="App">
<BrowserRouter>
<Routes>
<Route path="/home" element={<Home/>}></Route>
<Route path="/mine" element={<Mine/>}></Route>
</Routes>
</BrowserRouter>
</div>
)
}
export default App;
In the V5 version,
import React from "react"
import Home from "./pages/home"
import Mine from "./pages/mine"
import {BrowserRouter, Routes, Route} from 'react-router-dom'
function App() {
return (
<div className="App">
<BrowserRouter>
<Route path="/home" component={Home}></Route>
<Route path="/mine" component={Mine}></Route>
</BrowserRouter>
</div>
)
}
export default App;
Similar Posts:
- Uncaught SyntaxError: The requested module ‘/node_modules/.vite/react-router……Switch
- TypeError: Cannot read property ‘location‘ of undefined [How to Solve]
- Vue: How to use Vue-router in Axios
- Component is missing template or render function [How to Solve]
- How to Solve Request failed with status code 404
- [Solved] Vue router in the element UI navigation bar repeatedly clicks on the menu above version 3.0 and reports errors
- How to deal with the error “cannot read property ‘set state’ of undefined” in react
- Vue adds route errors dynamically: Uncaught Error… [How to Solve]
- DOM style setting methods in the four components of react