reduxjs-toolkit-persist

LocalStroage, reduxjs-toolkit-persist⁷.0.1, React¹⁷.0.2, react-redux⁷.2.4, @reduxjs/toolkit¹.6.0, Created at July 21, 2021, Read Series…

reduxjs-toolkit-persist: Persist and rehydrate a redux store. This is a fork of redux-persist that implements @reduxjs/toolkit (replacing the core redux dependency) as well as upgrading various dependencies to more recent versions.

npm install reduxjs-toolkit-persist

src/store/Store.ts

Store states is persisted in localStorage.
[Try to understand] usage of: persistReducer, storage, persistConfig, persistedReducer.

import { configureStore, getDefaultMiddleware } from '@reduxjs/toolkit';
import { persistReducer, FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER } from 'reduxjs-toolkit-persist'
// defaults to localStorage for web
import storage from 'reduxjs-toolkit-persist/lib/storage' 
import { reducers } from './CombinedReducers';
const persistConfig = {
    key: 'root',
    storage,
}
const persistedReducer = persistReducer(persistConfig, reducers)
const store = configureStore({
    reducer: persistedReducer
    middleware: getDefaultMiddleware({
        serializableCheck: {
            ignoredActions: [
                FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER,
            ],
       }
    })
})export default store;

Github commits is here: Basic-1.4.1. reduxjs-toolkit-persist

Conclusion

reduxjs-toolkit-persistis a company ofreduxjs-toolkit. Use reduxjs-toolkit-persistif you have reduxjs-toolkit in your React project.