Typescript ConnectedRouter No overload matches this call

Question

I am new to Typescript. I decide to migrate one of my React Javascript projects to Typescript. Because I am using Connected React Router, I followed its example here, but my IDE (IntelliJ) complains that "No overload matches this call". Here is my App.tsx

import React from 'react';
import { History } from 'history'
import { ConnectedRouter } from 'connected-react-router'
import {routes} from './redux/router/router';

interface AppProps {
  history: History
};

const App = ({history}: AppProps) => {
  return (
    <ConnectedRouter history={history}>
      {routes}
    </ConnectedRouter>
  );
};

export default App;

My routes are defined like this

import {Route, Switch} from 'react-router-dom';

const routes = (
  <>
    <Switch>
      <Route exact path='/' render={() => (<Page><Articles /></Page>)} />
      ....
    </Switch>
  </>
);

The error message in IDE is

Here are a few related dependencies

"connected-react-router": "^6.9.2"
"history": "^4.7.2",
"react": "^17.0.2",
"react-redux": "^7.2.6",
"react-router": "^5.2.1",
"react-router-dom": "^5.2.1",
"@types/history": "^4.7.2",
"@types/react": "^18.0.9",
"@types/react-dom": "^18.0.4",
"@types/react-redux": "^7.1.24",
"@types/react-router": "^5.1.18",

Any suggestion what may cause Typescript to complain? Thanks.

just a quick idea: have you tried making your history prop optional ? like doing history?: History in your interface? — julBayonna, Jun 05 '22 at 06:12

score 2 · Answer 1 · answered Jun 11 '22 at 05:43

I have the same problem and this is my solution:

import React from 'react';
import { History } from 'history'
import { ConnectedRouter } from 'connected-react-router'
import {routes} from './redux/router/router';

interface AppProps {
  history: History
};

const App = ({history}: AppProps) => {
  const props = {
    history: history
  }
  return (
    <ConnectedRouter {...props}>
      {routes}
    </ConnectedRouter>
  );
};

export default App;

Typescript ConnectedRouter No overload matches this call

1 Answers1