React Router DOM的Typescript错误

时间:2017-07-01 19:25:23

标签: typescript react-router react-router-dom

使用yarn安装react-router-domhistory后,安装各自的类型定义(@types/react-router-dom@types/history),我正在阅读以下错误。任何人都可以帮我解决它们,因为我不太清楚如何添加“构造或调用签名”,也不了解我传递给Route组件的组件有什么问题。

以下是错误:

Failed to compile.

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router/index.d.ts
(40,35): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router/index.d.ts
(46,29): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router/index.d.ts
(56,31): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router/index.d.ts
(74,28): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router/index.d.ts
(79,29): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router/index.d.ts
(87,35): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router/index.d.ts
(92,29): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router-dom/index.d.ts
(33,31): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router-dom/index.d.ts
(40,28): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router-dom/index.d.ts
(46,22): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in /Users/robskrob/code/projects/blog/node_modules/@types/react-router-dom/index.d.ts
(55,25): error TS2314: Generic type 'Component<P, S>' requires 2 type argument(s).

Error in ./src/index.tsx
(28,6): error TS2604: JSX element type 'Router' does not have any construct or call signatures.

Error in ./src/index.tsx
(29,8): error TS2604: JSX element type 'Switch' does not have any construct or call signatures.

Error in ./src/index.tsx
(30,10): error TS2604: JSX element type 'Route' does not have any construct or call signatures.

这是文件:

// React
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { Route, Router, Switch } from 'react-router-dom';
import { createBrowserHistory } from 'history';


// Redux
import { Provider } from 'react-redux';

// Custom
import Home from './containers/Home';

// Styles
import './styles.css';

// Store
import { configureStore } from './store';

// Configure Store
const store = configureStore();

const history = createBrowserHistory();

// Render
ReactDOM.render(
  <Provider store={store}>
    <Router history={history}>
      <Switch>
        <Route exact path='/' component={Home} />
      </Switch>
    </Router>
  </Provider>,
  document.getElementById('root') as HTMLElement
);

这是我的package.json:

{
  "name": "eai-reactjs-typescript-redux-starter",
  "description": "A ReactJS/TypeScript + Redux starter template with a detailed README describing how to use these technologies together and constructive code comments.",
  "version": "0.1.0",
  "private": true,
  "homepage": ".",
  "dependencies": {
    "amazon-cognito-identity-js": "^1.19.0",
    "amazon-cognito-js": "^1.1.0",
    "aws-sdk": "^2.80.0",
    "history": "^4.6.3",
    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-redux": "^5.0.5",
    "react-router-dom": "^4.1.1",
    "redux": "^3.7.0",
    "redux-logger": "^3.0.6"
  },
  "devDependencies": {
    "@types/enzyme": "^2.8.0",
    "@types/history": "^4.6.0",
    "@types/jest": "^19.2.3",
    "@types/node": "^7.0.18",
    "@types/react": "^15.0.24",
    "@types/react-dom": "^15.5.0",
    "@types/react-redux": "^4.4.40",
    "@types/react-router-dom": "^4.0.5",
    "@types/redux-logger": "^3.0.0",
    "enzyme": "^2.8.2",
    "react-addons-test-utils": "^15.5.1",
    "react-scripts-ts": "1.4.0",
    "redux-devtools-extension": "^2.13.2"
  },
  "scripts": {
    "start": "react-scripts-ts start",
    "build": "react-scripts-ts build",
    "test": "react-scripts-ts test --env=jsdom",
    "eject": "react-scripts-ts eject"
  }
}

如果有人想要仔细查看所有代码,这里是我的github回购a link

1 个答案:

答案 0 :(得分:1)

我遇到了同样的问题。运行npm install @types/react @types/react-dom --save-dev来更新修复它的软件包。