React Redux - Error passing several store enhancers to createStore()

Question

I have a react app running redux and thunk which has all been working fine. I need to persist the store state on page reload so that data is not lost, so have created a function which is storing data in the localstorage and then returning the data ready for adding to createStore (https://stackoverflow.com/a/45857898/801861). The data storage is working fine and returning the object ready for setting the sate. When adding the data object at createStore react fails to compile with this error:

Error: It looks like you are passing several store enhancers to createStore(). This is not supported. Instead, compose them together to a single function

Here is CURRENT CODE RETURNING ERROR:

const store = createStore(reducers, LoadState, applyMiddleware(thunk) );

//Error: It looks like you are passing several store enhancers to createStore(). This is not supported. Instead, compose them together to a single function

My original code which was running:

const store = createStore(reducers, applyMiddleware(thunk) );

I attempted to fix this following some similar issues I found online, compiles but breaks site code which was originally working fine:

const composeEnhancers = LoadState || compose;
const store = createStore(reducers, composeEnhancers( applyMiddleware(thunk) ) );
//Error: Actions must be plain objects. Use custom middleware for async actions.

Not sure what I need to change to get this to work, any help is appreciated.

Answer 1

I think you are following a tutorial which is performing tasks in a previous version of redux.

You need to create a composeEnhancer which will take in your Redux Dev Tools extension as shown

const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

after importing compose from 'redux' obviously as shown -

import {createStore, compose, applyMiddleware} from 'redux';

and then, you can create the store as shown -

const Store = createStore(rootReducer, composeEnhancer(applyMiddleware(thunk)))