reactjs - Το όρισμα τύπου 'AsyncThunkAction' δεν μπορεί να ανατεθεί σε παράμετρο τύπου 'AnyAction'


Αυτή τη στιγμή αναπτύσσω μια διαδικτυακή εφαρμογή βασισμένη σε Next.js.

Χρησιμοποιούμε Next.js + Redux + Redux-Thunk. Κάνω αυτήν την ερώτηση επειδή εμφανίστηκε ένα σφάλμα κατά την ανάπτυξη.

Το όρισμα τύπου 'AsyncThunkAction' δεν μπορεί να ανατεθεί σε παράμετρο τύπου 'AnyAction'. Η ιδιότητα 'type' λείπει στον τύπο 'AsyncThunkAction' αλλά απαιτείται στον τύπο 'AnyAction'.

Μέσα σε ένα component, η dispatch συνήθως λαμβάνει thunk συναρτήσεις ως παραμέτρους, αλλά το store.dispatch() δεν μπορεί να λαμβάνει thunk συναρτήσεις ως παραμέτρους της συνάρτησης getServerSideProps.

export const getServerSideProps = wrapper.getServerSideProps((store) => async () => {
    store.dispatch(getPeoples(1));
    return {
      props: {
        peoples: data,
      },
    };
  }
);

Είναι το 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);

Υπάρχει καλή λύση;

Απάντηση #1

createWrapper (από την έκδοση v7) θα πρέπει να το αναγνωρίσει σωστά. Μπορείς να δοκιμάσεις αν έχεις το ίδιο πρόβλημα όταν εισάγεις το store απευθείας; Υπάρχει ένα γνωστό πρόβλημα όταν κατά κάποιο τρόπο είναι εγκατεστημένα και τα redux 4.0.5 και 4.1.1 κάπου μέσα στα node_modules σου, με αποτέλεσμα ο τύπος του dispatch να διαστρεβλώνεται και να μπορείς να το αντιληφθείς με αυτόν τον τρόπο - αν αντιμετωπίσεις το ίδιο πρόβλημα χρησιμοποιώντας το store απευθείας, θα χρειαστεί να διορθώσεις αυτό το ζήτημα εγκατάστασης.