React Router DOM ile Typescript hataları

react-router-dom ve history'yi yarn ile yükledikten, ayrıca bunların tip tanımlarını (@types/react-router-dom ve @types/history) yükledikten sonra, aşağıdaki hataları alıyorum. Bunları çözmeme yardım edebilecek biri var mı? Çünkü 'construct veya call imzalarını' nasıl ekleyeceğim konusunda çok emin değilim ve Route bileşenime geçtiğim bileşenle ilgili yanlış olanı da anlamıyorum.

İşte hatalar:

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.

İşte dosya:

// 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
);

ve işte benim package.json dosyam:

{
  "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"
  }
}

İşte kodların tamamına daha yakından bakmak isteyenler için GitHub depoma bir bağlantı.

Cevap #1

Aynı sorunu yaşadım. Bu paketleri güncellemek için npm install @types/react @types/react-dom --save-dev çalıştırmak sorunu çözdü.