redux-thunk: Property 'type' missing when calling action through store.dispatch() redux-thunk: Property 'type' missing when calling action through store.dispatch() reactjs reactjs

redux-thunk: Property 'type' missing when calling action through store.dispatch()


An easy workaround to avoid the error message - though it is not a solution is:

dispatch<any>(DBActions.getImports(connection))


You can extend the Dispatch interface of redux using Declaration Merging of TypeScript. Extend the Dispatch interface with a ThunkDispatch overload signature. Then store.dispatch() method can dispatch async action.

store.ts:

import { applyMiddleware, createStore } from 'redux';import thunk, { ThunkAction } from 'redux-thunk';import { DBActions } from './action';declare module 'redux' {  interface Dispatch<A extends Action = AnyAction> {    <S, E, R>(asyncAction: ThunkAction<R, S, E, A>): R;  }}const store = createStore((state) => state, applyMiddleware(thunk));// dispatch async actionstore.dispatch(DBActions.startDatabase()).then(() => {  console.log(store.getState());});// dispatch sync actionstore.dispatch(DBActions.connectDatabase());

package versions:

"redux": "^4.1.0","redux-thunk": "^2.3.0""typescript": "^4.2.4"


I fought with this for a while, trying different combinations of typings and could not solve it.

It turns out the issue was because I had redux@4.0.5 and redux@4.1.0 installed next to each other.

To fix the issue I just did: yarn install redux@^4.1.10, which removed redux@4.0.5 from my yarn.lock file and resolved the issue!