'ReactPlayer' 不能用作 JSX 组件

Question

我尝试在我的 React 项目中使用 react-player。我正在使用打字稿。我在构建它时收到以下错误：

'ReactPlayer' 不能用作 JSX 组件。 它的实例类型“ReactPlayer”不是有效的 JSX 元素。 'render()' 返回的类型在这些类型之间不兼容。 类型 'ReactNode' 不可分配给类型 'false |元素 |空值'。 类型“未定义”不可分配给类型“假 |元素 |空值'。 我怀疑它是 ReactPlayer 特有的。我可能错误地配置了项目。有什么帮助吗？

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react"
  },
  "include": [
    "src"
  ]
}

package.json

{
  "name": "home-exercise",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "@types/jest": "^24.9.1",
    "@types/node": "^12.12.67",
    "@types/react": "^16.9.56",
    "@types/react-dom": "^16.9.8",
    "flexbox-react": "^4.4.0",
    "moment": "^2.29.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-player": "^2.6.2",
    "react-scripts": "3.4.3",
    "typescript": "^3.7.5"
  },

Answer 1

我基于examples from the library 创建了一个working example。我插入了你的tsconfig，一切似乎都正常。尝试将您的项目与那个项目进行比较。

import * as React from "react";
import ReactPlayer from "react-player";
import "./styles.css";

export default function App() {
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      <ReactPlayer url="https://www.youtube.com/watch?v=ysz5S6PUM-U" />
    </div>
  );
}

旁注；我很想看到你的import 声明ReactPlayer。该错误表明您没有导入您认为正在导入的内容。