使用 react-router-dom 版本 6 时出现以下错误：

Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

它说我的 BrowserRouter 有问题，这似乎指向 React 和渲染器不匹配。但是，我找不到任何问题。以下是导致错误的代码片段：

import React from 'react';
import './App.css';
import { BrowserRouter, Route, Routes } from 'react-router-dom';
import Home from "./pages/Home";

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

export default App;

执行 npm ls react 会产生以下内容：

├─┬ [email protected]
│ ├─┬ @restart/[email protected]
│ │ └── [email protected] deduped
│ ├─┬ @restart/[email protected]
│ │ ├─┬ @react-aria/[email protected]
│ │ │ └── [email protected] deduped
│ │ └── [email protected] deduped
│ ├─┬ [email protected]
│ │ └── [email protected] deduped
│ ├─┬ [email protected]
│ │ └── [email protected] deduped
│ ├─┬ [email protected]
│ │ └── [email protected] deduped
│ ├── [email protected]
│ └─┬ [email protected]
│   └── [email protected] deduped
├─┬ [email protected] extraneous
│ └── [email protected] deduped
└─┬ [email protected] extraneous
  └── [email protected] deduped

我被这个问题困扰了，任何帮助都将不胜感激！谢谢！