reactjs - JSX 元素类型 'X' 不是 JSX 元素的构造函数。 'render()' 返回的类型在这些类型之间不兼容

标签 reactjs typescript

我在项目中导入的每个类组件上都出现此错误,如果有人知道如何解决它,我将不胜感激

版本:

"react": "16.9.0",
"react-dom": "16.9.0",
"react-router-dom": "5.1.2",
"typescript": "3.7.4",
TypeScript error in /opt/buildagent/work/508378186b823554/src/AppRouter.tsx(49,7):
   JSX element type 'Router' is not a constructor function for JSX elements.
     The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/opt/buildagent/work/508378186b823554/node_modules/@types/hoist-non-react-statics/node_modules/@types/react/index").ReactNode'.
Type '{}' is not assignable to type 'ReactNode'.
Type '{}' is not assignable to type 'ReactPortal'.  TS2605

最佳答案

@types/react 最近添加了一个支持 react 18 的新版本,因此它不向后兼容。确保您没有意外地使用 React 17 和更低的代码库安装此软件包。

编辑:

如果你碰巧像 Andrew 那样使用@types/hoist-non-react-statics,你可以像这样用你的 package.json 锁定一个@types/react 版本:

"resolutions": {
    "@types/react": "17" // Or other version that is equivalent to your react version
  }

关于reactjs - JSX 元素类型 'X' 不是 JSX 元素的构造函数。 'render()' 返回的类型在这些类型之间不兼容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/71795948/

相关文章:

node.js - 匹配API和同构路由

javascript - Redux 工具包 createAsyncThunk 问题 : state updates after async dispatch call?

javascript - 模糊事件 : do not blur if click occurs within element

typescript - 别名与 Webpack 4 和 awesome-typescript 加载器不工作

angular - 如何在listview angular2 nativescript中解析这个json结构

javascript - 为什么项目附加到 redux 而不是替换?

reactjs - React 中的容器应该可重用吗?

javascript - Angular : No Error but not showing data in Material Table

angular - 无法解析 '@angular/material/typings/'

javascript - 我如何找到 typescript 版本支持的 ecmascript 版本列表?