V6 React Router Dom Routes are not working ,only blank page - react-dom

Question

I am a beginner in React. Here is my app.js. I did the exactly tutorial said. But the http://localhost:3000 is totally blank. Can someone check for me? Thanks
App.js
import './App.css';
import {BrowserRouter as Router, Routes, Route} from 'react-router-dom';
import Home from './Pages/Home';
import About from './Pages/About';
function App() {
return (
<Router>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/about" element={<About />} />
</Routes>
</Router>
);
}
export default App
Home.js
import React from 'react'
function Home() {
return (
<div>
<h2>Home View</h2>
<p>Lorem ipsum dolor sit amet, consectetur adip.</p>
</div>
);
}
export default Home
About.js
import React from 'react'
function About() {
return (
<div>
<h2>About View</h2>
<p>Lorem ipsum dolor sit amet, consectetur adip.</p>
</div>
);
}
export default About
I study from https://blog.logrocket.com/react-router-v6/