ReactJs Solved— Matched leaf route at location “/” does not have an element

Matched leaf route at location “/” does not have an element. This means it will render an with a null value by default resulting in an “empty” page.

Old version:

import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import Home from './pages/Home';
// import ReactDOM from "react-dom";


const App = () => {
  return (

    <Router >
      <Routes>

        <Route path="/" component={ Home }></Route>
      </Routes>
    </Router>


  )
}

export default App;

New approach

In V6, you can’t use the component prop anymore. It was replaced in favour of element:

<Route path="/" element={<Home />}></Route>

More info in the migration doc.