Unable to use react-native-debugger after updating 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

score 14 · Accepted Answer · answered Oct 23 '18 at 15:42

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!

score 2 · Answer 2 · answered Jan 15 '20 at 13:04

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;

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

2 Answers2