React Router V6 shows blank page-CodePudding

I am facing a problem. I am trying to use React Router but it keeps showing me a blank page. Here is my code:

App.js:

import React from "react";
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
import HomePage from "./HomePage";

function App() {
  return (
    <Router>
      <Routes>
        <Route path="/" element={<HomePage />} />
      </Routes>
    </Router>

  );
};

export default App;

HomePage.js:

import React from "react";
import {withRouter} from "react-router-dom"

const HomePage = () => {

    return <div>hi</div>
}

export default HomePage;

index.js:

import React from "react";
import ReactDom from "react-dom";
import App from './App';


ReactDom.render(<App/>, document.getElementById("root"))

I've installed "React Router V6", can anyone tell me what is the problem? Thanks for all the helpers.

CodePudding user response：

I tried the code you provided and it works fine

you can see the code in stackblitz: https://stackblitz.com/edit/react-wyl22d?file=src/App.js

can you provide us with more details open the console to see if there are any errors?

CodePudding user response：

I find the error, in the HomePage.js component is required the "( )" in return

import React from "react";
import {withRouter} from "react-router-dom"

const HomePage = () => {

    return (
     <div>
       Hi
     </div>   
    )

}

export default HomePage;