javascript - 尝试导入错误 : 'Routes' is not exported from 'react-router-dom'

Question

我正在尝试使用 React 路由器和路由，但不断收到此错误:

我尝试了以下方法:

删除并重新安装 react-router-dom 和 react-router。

删除 node_modules 文件夹并运行 npm install

确保 react-router 和 react-router-dom 版本相同

是的，我在上面列出的每次尝试后都重新启动了我的服务器。

这是我的 index.js 代码:

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import reportWebVitals from "./reportWebVitals";
import { BrowserRouter as Router } from "react-router-dom";
import { Switch, Route, Routes } from "react-router-dom";
import Whoops404 from "./components/Whoops404";

function Pages() {
  return (
    <Routes>
      <Switch>
        <Route path="/" element={<App />} />
        <Route path="*" element={<Whoops404 />} />
      </Switch>
    </Routes>
  );
}

ReactDOM.render(
  <React.StrictMode>
    <Router>
      <Pages />
    </Router>
  </React.StrictMode>,
  document.getElementById("root")
);

package.json 依赖:

  "dependencies": {
    "@craco/craco": "^6.1.2",
    "@testing-library/jest-dom": "^5.13.0",
    "@testing-library/react": "^11.2.7",
    "@testing-library/user-event": "^12.8.3",
    "react": "^17.0.2",
    "react-axios": "^2.0.5",
    "react-dom": "^17.0.2",
    "react-player": "^2.9.0",
    "react-router": "^5.2.0",
    "react-router-dom": "^5.2.0",
    "react-scripts": "4.0.3",
    "react-spinners": "^0.11.0",
    "video-react": "^0.14.1",
    "web-vitals": "^1.1.2"
  },

Answer 1

您已使用“npm i react-router-dom”来安装路由器。路由不附带。
使用 'npm i react-router-dom@next' 安装 Routes 附带的即将发布的版本。