React-router-dom：链接编译失败

Posted 2023-02-22

【中文标题】React-router-dom：链接编译失败

【英文标题】：React-router-dom: Link failed to compile

【发布时间】：2020-10-03 11:37:06

【问题描述】：

我正在使用 create-react-app 并遇到 react-router-dom 的问题。问题是当我尝试使用 Link 或 NavLink 组件时出现此错误：

例如，来自 react-router-dom 的 Router 和 Route 组件可以正常工作。

package.json

  "name": "pmboard-gui-bp3",
  "version": "0.1.0",
  "private": true,
  "dependencies": 
    "@blueprintjs/core": "^3.28.2",
    "@blueprintjs/datetime": "^3.18.2",
    "@blueprintjs/docs-theme": "^3.6.1",
    "@blueprintjs/select": "^3.13.3",
    "@blueprintjs/table": "^3.8.9",
    "@material-ui/icons": "^4.9.1",
    "axios": "^0.19.2",
    "babel-plugin-transform-es2015-arrow-functions": "^6.22.0",
    "chart.js": "^2.9.3",
    "chartjs-plugin-annotation": "^0.5.7",
    "dotenv": "^8.2.0",
    "file-saver": "^2.0.2",
    "formik": "^1.5.8",
    "history": "^4.10.1",
    "moment": "^2.26.0",
    "node-sass": "^4.14.1",
    "prop-types": "^15.7.2",
    "quill": "^1.3.7",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-helmet": "^6.1.0",
    "react-quill": "^1.3.5",
    "react-redux": "^7.2.0",
    "react-rnd": "^10.1.10",
    "react-router-dom": "^5.2.0",
    "react-router-redux": "^4.0.8",
    "react-scripts": "3.0.1",
    "redux": "^4.0.5",
    "redux-createreducer": "^2.0.0",
    "redux-saga": "^1.1.3",
    "yup": "^0.27.0"
  ,
  "scripts": 
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  ,
  "eslintConfig": 
    "extends": "react-app"
  ,
  "browserslist": 
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ]
  ,
  "devDependencies": 
    "classnames": "^2.2.6",
    "enzyme": "^3.11.0",
    "enzyme-adapter-react-16": "^1.15.2",
    "prop-types": "^15.7.2",
    "redux-logger": "^3.0.6"
  

我试图删除 node_modules 并重新安装它 -> 没用。

有什么想法吗？ 如有必要，我会提供任何信息。

非常感谢您。

【问题讨论】：

您能否分享一下您从“react-router-dom”和导入语句中敲击路由器的代码。另外，请分享您如何使用导航链接或链接的代码

@KushalSeth，感谢您的评论。它帮助我弄清楚我的导入是错误的。我的 IDE 自动从 react-router-dom/modules/Link 导入链接，但不是从 react-router-dom。现在问题解决了。再次感谢您的回答。

谢谢。已发布答案，请将其标记为已关闭。

【参考方案1】：

将 import Link 从 react-router-dom/modules/Link 更改为 import Link from "react-router-dom"; 解决了这个问题。

即使我建议使用“react-router-dom”中的 NavLink；在使用 Link 时，您可能会遇到一些问题。并且推荐使用 NavLink。