Πώς να χρησιμοποιήσετε τα devtools του zustand με TypeScript;


Προσπαθώ να χρησιμοποιήσω τη λειτουργία devtools του zustand. Χρησιμοποιώ επίσης TypeScript. Όταν περνάω το store στα devtools, ολόκληρος ο κώδικας του store μου εμφανίζει σφάλμα ως εξής: Το όρισμα τύπου 'StateCreator<Store, [], [["zustand/devtools", ποτέ]], Store>' δεν μπορεί να ανατεθεί στην παράμετρο τύπου 'StateCreator<Store, [], [], Store>'.

Ορίστε ο κωδικός του καταστήματός μου:

const useUserStore = create<Store>(devtools((set) => ({
    token: "",
    isLogged: false,

    loginUser: (jwtToken: string) => {
        set((state) => ({
            ...state,
            token: jwtToken,
            isLogged: true,
        }));
    },

    logoutUser: () => {
        set((state) => ({
            ...state,
            token: "",
            isLogged: false,
        }));
    },
})));

Ορίστε ο τύπος καταστήματος:

export type Store = {
    token: string;
    isLogged: boolean;
    loginUser: (jwtToken: string) => void;
    logoutUser: () => void;
};

Παρακαλώ καθοδήγησέ με σχετικά με το πώς να επιλύσω αυτό το σφάλμα.

Απάντηση #1

Δοκιμάστε να αλλάξετε create<Store>(devtools... σε create<Store>()(devtools... (Σημειώστε το επιπλέον ζευγάρι παρενθέσεων)

Αυτό είναι τεκμηριωμένο στο Readme τους