React Router V6 不显示页面？

Question

我正在尝试使用反应路由器 v6。 但是，当尝试下面的这些路线时，它只会显示一个空白页面。 可能是什么问题呢？

应用程序.js

import React from 'react'
import { BrowserRouter, Routes, Route } from 'react-router-dom'
import Home from './components/home';

function App() {
  return <BrowserRouter>
    <Routes>
      <Route path='/' element={<Home />} />
      <Route path='/hi' element={<div>hi</div>} />
      <Route path='/bye' element={<div>bye</div>} />
    </Routes>
  </BrowserRouter>

}

export default App;

主页.jsx

import React from "react";

export default function Home(){
    return <h1>Home</h1>
}

index.js

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";


ReactDOM.render(
  <App />, document.getElementById('root'))

Answer 1

有用。 检查您的库或重新安装包（npm install）。

删除 package.lock 文件和 node_modules 后

import React from "react";
import { BrowserRouter, Routes, Route } from "react-router-dom";
// import Home from "./home";

function Home() {
  return <h1>Home</h1>;
}

function App() {
  return (
    <BrowserRouter>
      <Routes>
        <Route path="/" element={<Home />} />
        <Route path="/hi" element={<div>hi</div>} />
        <Route path="/bye" element={<div>bye</div>} />
      </Routes>
    </BrowserRouter>
  );
}

export default App;