use redux-devtools-extension with react-native with chrome - react-native

Question

Need help in setup Redux devTools for react-native
I have very simple reducer and createStore here, and I try to incorporate redux-devtools-extension, so I can debug my react-native
app, but I got "store no found" in Redux tab
import { createStore, applyMiddleware} from 'redux'
import {reducer} from "./reducers"
import { composeWithDevTools, devToolsEnhancer } from 'redux-devtools-
extension'
let store = createStore(reducer, devToolsEnhancer());
export const reducer = (state=[], action) => {
switch(action.type) {
case "ADD_MEMBER":
return [...state, {categoryID: 0, name: "Bill", zip: "27733", id: 4}]
default:
return state
}
return state;
}

Answer 1

Redux DevTools Extension cannot access the React Native worker, as extensions cannot inject code into web workers. You have to use remote-redux-devtools to communicate with the extension via websockets.
You'll have just to replace
import { devToolsEnhancer } from 'redux-devtools-extension'
with
import devToolsEnhancer from 'remote-redux-devtools';
Then from the extension context menu, click on "Open Remote DevTools". By default it'll use its remote server for quick bootstrapping, but it's recommended to run your local server by installing and running remotedev-server. It's similar to how you have to install and run react-devtools package for React Native.

Answer 2

Another option is to use React Native Debugger.
The win is, you don't have to npm install redux devtools every time. The debugger provides you the good old "REDUX_DEVTOOLS_EXTENSION" out of the box.
So, if you are reusing code from web, you do not need any code changes. The same set up as redux devtools extension will just work.
For a thorough guide on how to setup React Native Debugger with an Expo app look here. (As the official docs are a bit confusing.)