Reputation: 21
I am currently developing a web application based on Next.js.
We are using Next.js + Redux + Redux-Thunk. I'm asking this question because an error occurred during development.
Argument of type 'AsyncThunkAction<any, number | undefined, {}>' is not assignable to parameter of type 'AnyAction'. Property 'type' is missing in type 'AsyncThunkAction<any, number | undefined, {}>' but required in type 'AnyAction'.
Within a component, dispatch usually receives thunk functions as parameters, but store.dispatch()
cannot receive thunk functions as parameters of the getServerSideProps
function.
export const getServerSideProps = wrapper.getServerSideProps((store) => async () => {
store.dispatch(getPeoples(1));
return {
props: {
peoples: data,
},
};
}
);
It's my store.tsx
const makeStore = () => configureStore({
reducer: rootReducer,
middleware: getDefaultMiddleware => getDefaultMiddleware(),
// devTools,
// preloadedState,
// enhancers:
});
export type AppStore = ReturnType<typeof makeStore>;
export type AppState = ReturnType<AppStore['getState']>;
export type AppThunk<ReturnType = void> = ThunkAction<ReturnType, AppState, unknown,
Action>;
export type AppThunkDispatch = ThunkDispatch<{}, void, AnyAction>
export default createWrapper(makeStore);
Is there a good solution?
Upvotes: 2
Views: 1113
Reputation: 44086
createWrapper
(since v7) should pick that up correctly. Can you test if you have the same problem when importing store
directly?
There is a known problem when somehow redux 4.0.5 and 4.1.1 are installed both somewhere in your node_modules
that the dispatch
type goes off and you could detect that that way - if you face the same problem using store
directly, you'll need to fix that installation issue.
Upvotes: 1