3

I'm using this

extension to see my redux store. When I open my remote debugger, in the console I am connected to remotedev-server, but my redux tools says no store found.

Below is my store setup

 import React, { Component } from 'react';
    import { Provider } from 'react-redux';
    import promiseMiddleware from 'redux-promise-middleware';
    import { createStore, applyMiddleware } from 'redux';
    import { composeWithDevTools } from 'remote-redux-devtools';
    import thunkMiddleware from 'redux-thunk';
    import rootReducer from './src/Reducers/index';
    import NavigationApp from './src/components/Navigation/Navigation';


    const store = createStore(rootReducer, composeWithDevTools(
      applyMiddleware(thunkMiddleware, promiseMiddleware()),
    ));

    export default class App extends Component<{}> {
      render() {
        return (
          <Provider store={store}>
            <NavigationApp />
          </Provider>
        );
      }
    }

package.json 
{
  "name": "App",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "axios": "^0.17.1",
    "react": "16.0.0",
    "react-native": "^0.54.2",
    "react-native-elements": "^0.18.5",
    "react-native-vector-icons": "^4.4.2",
    "react-navigation": "^1.0.0-beta.22",
    "react-redux": "^5.0.7",
    "redux": "^3.7.2",
    "redux-promise-middleware": "^5.0.0",
    "redux-thunk": "^2.2.0",
    "remote-redux-devtools": "^0.5.12"
  },
  "devDependencies": {
    "babel-jest": "21.2.0",
    "babel-preset-react-native": "4.0.0",
    "eslint-config-rallycoding": "^3.2.0",
    "jest": "21.2.1",
    "react-test-renderer": "16.0.0"
  },
  "jest": {
    "preset": "react-native"
  }
}

I've also follow this

stack overflow thread's instructions but no cigar. Am I missing anything from a recent update? Am I missing a package that goes along with react native redux setup?

Side note, my action is returning a resolved promise

Generaldeep
  • 437
  • 2
  • 12
  • 30

1 Answers1

1

In your call to createReducer:

const store = createStore(rootReducer, composeWithDevTools(
  applyMiddleware(thunkMiddleware, promiseMiddleware()),
));

you are not specifying your store's initial data (referred to as preloadedState in the documentation).

You need to change your code to:

const store = createStore(rootReducer, preloadedState, composeWithDevTools(
  applyMiddleware(thunkMiddleware, promiseMiddleware())));
Ben Smith
  • 19,589
  • 6
  • 65
  • 93
  • I actually don't know what my preloaded state is. I tried importing my initial state (which for now is just an empty array) from my reducers directory and that gives me this errror "ExceptionsManager.js:73 Unexpected key "testData" found in previous state received by the reducer. Expected to find one of the known reducer keys instead: "testReducer". Unexpected keys will be ignored." – Generaldeep Mar 30 '18 at 06:46
  • My answer explains why the code you posted doesn't work. However the fact that you don't know what your preloaded state is suggests to me that you probably havent written your reducer correctly either. Is this the first time you are using Redux? – Ben Smith Mar 30 '18 at 20:47
  • No, I worked with Redux about 8 months ago. And I had/have a file called initialState which consists of empty arrays or objects that are populated based on actions. I used Redux with React, this is my first time using it with React Native. With that beind said, my error isn't about redux, it's about the redux dev tool not showing in my chrome. If that make sense. – Generaldeep Mar 31 '18 at 07:10