Unable to use react-native-debugger after updating react-native - react-native

Question

React Native Debugger app version: v0.8.1
React Native version: 0.57.3
I am getting this error
It looks like you are passing several store enhancers to createStore(). This is not supported. Instead, compose them together to a single function
It was working before I updated from 0.55.
This is how I create my store.
import { createStore, compose, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import reducers from '../reducers';
const store = createStore(
reducers,
window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__(),
compose(applyMiddleware(thunk)),
);
export default store;
It works fine when I use Chrome to debug.
Please help, thanks

Answer 1

Instead of passing three arguments to the createStore function, you need to pass two (one of them is meant for a preloaded state, something we are not using here). To get around that, while still using the redux dev tools, you need to use the dev tools as the composer itself:
import { createStore, compose, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import reducers from '../reducers';
const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(
reducers,
composeEnhancer(applyMiddleware(thunk)),
);
export default store;
I realised this was the solution after digging around the redux library's, the debugger app's, and the dev tool's source code, and found this section: https://github.com/zalmoxisus/redux-devtools-extension#12-advanced-store-setup
I also saw an almost identical issue on github which I assume is yours, but I thought I would post the answer again here in case someone sees it here.
Hope this helps!

Answer 2

Because I had the same problem and wanted to use redux-devtools-extension the provided solution here could not be applied 1:1. How ever this one tuned out to do the job:
import { applyMiddleware, combineReducers, createStore } from 'redux';
import appConfigReducer from '../reducers/appConfigReducer';
import logger from 'redux-logger'
import { composeWithDevTools } from "redux-devtools-extension";
const rootReducer = combineReducers(
{config: appConfigReducer}
);
const composeEnhancers = composeWithDevTools({
// options like actionSanitizer, stateSanitizer
});
const configureStore = () => {
return createStore(rootReducer,
composeEnhancers(applyMiddleware(logger))
);
};
export default configureStore;