命名空间“React”没有导出的成员“FC”。在“@types/reactor”中答案

【问题标题】：Namespace 'React' has no exported member 'FC'. in '@types/reactour'命名空间“React”没有导出的成员“FC”。在“@types/reactor”中
【发布时间】：2019-10-24 12:17:50
【问题描述】：

我正在使用 React 应用程序。我的 package.json 文件如下。

`{
  ...
  ...
  "dependencies": {
    "@storybook/addon-backgrounds": "^3.4.8",
    "@storybook/react": "^4.0.0-alpha.4",
    "@types/d3": "^5.0.0",
    "@types/debug": "^0.0.30",
    "@types/enzyme": "^3.1.9",
    "@types/jest": "^23.1.4",
    "@types/moment-timezone": "^0.5.4",
    "@types/react": "^16.0.38",
    "@types/react-color": "^3.0.1",
    "@types/react-copy-to-clipboard": "^4.2.6",
    "@types/react-dom": "^16.0.4",
    "@types/react-intl": "^2.3.16",
    "@types/react-mentions": "2.4.0",
    "@types/react-redux": "^6.0.3",
    "@types/react-router": "^4.0.22",
    "@types/react-router-dom": "^4.2.4",
    "@types/react-select": "^1.2.6",
    "@types/react-show-more": "^2.0.1",
    "@types/redux": "^3.6.0",
    "@types/redux-form": "^7.3.1",
    "@types/redux-logger": "^3.0.6",
    "@types/storybook__addon-backgrounds": "^3.2.0",
    "@types/storybook__react": "^3.0.8",
    "awesome-typescript-loader": "^5.2.0",
    "axios": "^0.18.0",
    "babel-register": "^6.26.0",
    "connected-react-router": "^4.4.1",
    "cosed": "^1.1.8",
    "d3": "^5.7.0",
    "date-fns": "^1.29.0",
    "debug": "^3.1.0",
    "duplicate-package-checker-webpack-plugin": "^3.0.0",
    "emoji-mart": "^2.6.1",
    "enzyme": "^3.3.0",
    "enzyme-adapter-react-16": "^1.1.1",
    "gen-tester": "^3.1.2",
    "html-loader": "^0.5.5",
    "html-webpack-plugin": "^3.1.0",
    "husky": "^0.14.3",
    "immer": "^1.3.1",
    "jest": "^23.3.0",
    "jest-environment-enzyme": "^6.0.2",
    "jest-enzyme": "^6.0.2",
    "jest-styled-components": "^5.0.1",
    "lint-staged": "^7.2.0",
    "moment-timezone": "^0.5.14",
    "prettier": "^1.13.7",
    "react": "^16.8.0",
    "react-color": "^2.17.3",
    "react-copy-to-clipboard": "^5.0.1",
    "react-cosed": "^1.0.9",
    "react-dom": "^16.2.0",
    "react-intl": "^2.8.0",
    "react-mentions": "^2.4.1",
    "react-redux": "^5.0.7",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "react-select": "^1.2.1",
    "react-show-more": "^2.0.0",
    "reactour": "^1.8.5",
    "redux": "^4.0.0",
    "redux-cosed": "^1.0.1",
    "redux-form": "^7.4.2",
    "redux-logger": "^3.0.6",
    "redux-persist": "^5.10.0",
    "redux-thunk": "^2.3.0",
    "styled-components": "^3.1.6",
    "ts-jest": "^23.0.0",
    "tslint": "^5.9.1",
    "tslint-config-prettier": "^1.13.0",
    "tslint-no-circular-imports": "^0.5.0",
    "typescript": "^2.7.2",
    "uglifyjs-webpack-plugin": "^1.2.7",
    "url-loader": "^1.0.1",
    "webpack": "^4.15.1",
    "webpack-cli": "^3.0.8",
    "webpack-dev-server": "^3.1.5",
    "webpack-merge": "^4.1.3"
  },
  "lint-staged": {
    "*.{js,ts,tsx}": [
      "prettier --write",
      "git add"
    ]
  },
  "devDependencies": {
    "@types/lodash.debounce": "^4.0.4",
    "@types/reactour": "^1.13.1",
    "firebase-tools": "^6.1.0",
    "lodash.debounce": "^4.0.8"
  }
}

`

我尝试使用reactour 为我的应用程序添加介绍导览。当我在我的应用程序中添加包'reactour'时，它要求@types/reactour，我也添加了它。但仍然面临一些依赖包的问题。

我添加了这些..

`"dependencies": {
    ...
    ...
    "@types/reactour": "^1.13.0",
    "reactour": "^1.8.5",
    ...
    ...
}`

错误在控制台...

> ✖ ｢atl｣: Checking finished with 13 errors [at-loader]
> ./node_modules/@types/react-mentions/index.d.ts:38:24 
>     TS2314: Generic type 'UIEvent<T>' requires 1 type argument(s). 
> 
> [at-loader] ./node_modules/@types/react-mentions/index.d.ts:45:22 
>     TS2694: Namespace 'React' has no exported member 'RefObject'. 
> 
> [at-loader] ./node_modules/@types/react-mentions/index.d.ts:45:61 
>     TS2694: Namespace 'React' has no exported member 'RefObject'. 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:276:43 
>     TS2314: Generic type 'ReactElement<P>' requires 1 type argument(s). 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:278:43 
>     TS2694: Namespace 'React' has no exported member 'ComponentPropsWithRef'. 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:281:27 
>     TS2694: Namespace 'React' has no exported member 'FC'. 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:287:43 
>     TS2314: Generic type 'ReactElement<P>' requires 1 type argument(s). 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:289:46 
>     TS2694: Namespace 'React' has no exported member 'ComponentPropsWithRef'. 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:290:30 
>     TS2694: Namespace 'React' has no exported member 'FC'. 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:292:41 
>     TS2694: Namespace 'React' has no exported member 'ComponentPropsWithRef'. 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:299:25 
>     TS2694: Namespace 'React' has no exported member 'FC'. 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:301:37 
>     TS2694: Namespace 'React' has no exported member 'ComponentPropsWithRef'. 
> 
> [at-loader] ./node_modules/@types/reactour/index.d.ts:302:32 
>     TS2694: Namespace 'React' has no exported member 'FC'.

请提出一些解决方案... 谢谢

【问题讨论】：

标签： reactjs typescript

【解决方案1】：

如果您忘记将文件的扩展名命名为.tsx 并将其保留为.ts，也会发生类似的错误

【讨论】：

【解决方案2】：

将@types/react 更新到最新版本或特定版本以匹配您的 react 和 react-dom 包。

npm i @types/react@latest --save-dev

或

yarn add @types/react --dev

您不需要替换您的 node_modules 或您的锁定文件。

【讨论】：

【解决方案3】：

将您的@types/react 更新到最新版本（16.9.9 atm）。

您可能需要运行npm i @types/react --save-dev，但手动替换版本也应该可以。

【讨论】：

我试过npm i @types/react --save-dev，但错误仍然存在。
如果手动将 @types/react 的版本替换为 16.9.9 会怎样？
奇怪，至少前三个错误应该已经消失了。
尝试将 react-dom 和 react-redux 的类型也更新到最新版本。

【解决方案4】：

它对我有用。删除yarn.lock文件，更新@types/react后删除node_modules。

并安装了纱线。

【讨论】：

【解决方案5】：

如果您来自诸如 Visual Studio 之类的 IDE 并引发此错误（与来自命令行的 OP 相比），重新启动 IDE 通常可以解决此错误。

【讨论】：