create-react-app - inspect Redux store in production build

问题

I am using create-react-app as an initial scaffold for an app that I am working on that exists within an existing php/jQuery app. After a bit of fiddling about I have been able to setup communication between the non-React app and the React app by using the method described here.

What I'm currently doing is creating a build of the React app then inserting it into the non-React app, however I am finding troubleshooting the build version of the app slow and cumbersome because I am unable to inspect the Redux store through Chrome's Redux plugin. I am guessing that the ability to inspect the Redux store from a production ready build is disabled as part of create-react-app? I'm trying to avoid ejecting the app if possible so am wondering if there is any way to inspect the Redux store for the production build?

回答1:

There is another simple method to inspect redux store using 'React Dev Tools'. But I'm not sure whether it will work for your scenario as you are using React inside a Non-React app.

Simply open your dev tools and select your Provider component. Then you will see == $r sign right next to the component. What this basically says is you can you $r in the console to access the current instance of Provider component.

Now you can go to Console tab and enter the following line to see your current state.

> . $r.store.getState()

You can use this approach to inspect any other React component as well.

Hope this helps!

回答2:

Just realised that it was completely my own fault - when setting up the configuration for Redux store I had specified:

if (process.env.NODE_ENV === 'development') {
  const devToolsExtension = window.devToolsExtension;

  if (typeof devToolsExtension === 'function') {
    enhancers.push(devToolsExtension());
  }
}

I've removed the conditional on process.end.NODE_ENV === 'development' and I can now inspect Redux store from production build.

Thanks to commenters on suggestions. Sorry to waste your time!

来源：https://stackoverflow.com/questions/45766727/create-react-app-inspect-redux-store-in-production-build

标签

javascript

reactjs

create-react-app