reactjs - React-router med TypeScript

Jag använder react-router och react-router-dom med Typescript för att bygga en applikation. Jag har definierat mina rutter på detta sätt (routes.tsx):

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

const history = createBrowserHistory();

const Routes: React.StatelessComponent<{}> = () => (
  <Router history={history}>
    <Switch>
      <Route exact path='/signup' component={SignUp} />
    </Switch>
  </Router>
);

export default Router;

Jag har en huvudkomponent App som renderar denna komponent Routes:

import * as React from 'react';
import Routes from './routes';

const App: React.StatelessComponent<{}> = () => (
  <Routes />
);

export default App;

Kompilatorn kastar detta fel

(5,4): Type '{}' is not assignable to type 'Readonly<RouterProps>'.
  Property 'history' is missing in type '{}'.

Jag är ny på TS så jag är inte säker på vad som exakt pågår.

Svar #1

TypeScript, som de flesta språk, förväntar sig en typspecificering mellan < >-markörer på en klass. Detta indikerar att klassen är en generisk som förväntar sig vidare definition.

Jag kan inte hitta specifik dokumentation om den här klassen som du använder, men jag skulle gissa att något liknande detta kan hjälpa dig att komma till rätt plats:

const App: React.StatelessComponent<RouterProps> = () => (
  <Routes />
);