Expo React Native App Redux Persist A sync Storage Problem

Just started a new Managed Expo React Native project (Expo SDK 35, React Native 0.5.9) using redux-persist@6.0.0 but even a fresh expo project with redux/redux-persist is currently throwing the error below.


Using AsyncStorage from react-native,

we get the error:

redux-persist: config.storage is required. Try using one of the provided storage engines import storage from 'redux-persist/lib/storage'


Using AsyncStorage from @react-native-community/async-storage,

we get the error:

[@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.


Using storage from redux-persist/lib/storage,

we get the error:

console.error: “redux-persist failed to create sync storage. falling back to noop storage.”


Question: How do we solve this problem without ejecting? Thanks!


redux-persist Code

Note: Previous attempts have been commented out:

// Chose 1 of the 3 storages
// import { AsyncStorage } from "react-native";
// import AsyncStorage from '@react-native-community/async-storage';
import storage from 'redux-persist/lib/storage'

import { createMigrate, persistStore, persistReducer } from "redux-persist";
import reducer from "../reducers";

const persistConfig = {
    key: 'root',
    version: 0,
    storage,    // 'redux-persist/lib/storage'
}

// const persistConfig = {
//   key: 'root',
//   version: 0,
//   AsyncStorage,    // '@react-native-community/async-storage'
// }

const persistedReducer = persistReducer(persistConfig, reducer);

This import is for Web App :

import storage from 'redux-persist/lib/storage'

For React Native, you should use the following imports:

import AsyncStorage from '@react-native-community/async-storage';
import { createMigrate, persistStore, persistReducer } from "redux-persist";
import reducer from "../reducers";

const persistConfig = {
    key: 'root',
    version: 0,
    //...
    storage: AsyncStorage
}

const persistedReducer = persistReducer(persistConfig, reducer);

For React Native below code does not work.

import AsyncStorage from '@react-native-async-storage/async-storage';

const persistConfig = {
    key: 'root',
    AsyncStorage
}

Because persistConfig expects a key storage

Below persistConfig works for React Native.

import AsyncStorage from '@react-native-async-storage/async-storage';

const persistConfig = {
    key: 'root',
    storage: AsyncStorage
}

It might be a library linking issue.

Make sure you ran react-native link @react-native-community/async-storage

I would also suggest going to your ios folder and running pod install.

If you’re not using Cocoapods, have a look here for manual linking.

  1. yarn add @react-native-async-storage/async-storage
  2. import AsyncStorage from ‘@react-native-async-storage/async-storage’; const authPersistConfig = { key: ‘auth’, stateReconciler: autoMergeLevel2, storage: AsyncStorage, whitelist: [‘isAuthenticated’, ‘sessionToken’, ‘userId’], };

Leave a Reply