Redux的调试工具Redux DevTools

Redux DevTools是一款用于调试的浏览器插件，它用来时时显示当前应用的state信息，action触发记录以及state的变化，在开发过程中非要有用，目前这个插件支持chrome和FireFox浏览器，我们以chrome为列，在chrome的应用商店中下载安装Redux DevTools插件，然后在configStore.js中，使用Redux DevToold创建"加强版"的store：

import {create,applyMiddle,applyMiddleware,compose} from "redux";

import thunk from "redux-thunk";

import rootReducer from "./modules";

let finalCreateStore;

//假如浏览器运行在非生产模式下，且浏览器安装了调试插件，则创建包含调试插件的store

if(process.env.NOT_ENV!=="production"&&window.__REDUX__DEVTOOLS__EXTENSION__){

  finalCreateStore=compose(

   applyMiddleware(thunk),

   window.__REDUX__DEVTOOLS__EXTENSION__()

)(createStore)

}else{

   finalCreateStore=applyMiddleware(thunk)(createStore)

}

export default function configureStore(initialState){

  const store=finalCreateStore(rootReducers,initialState);

  return store;

}

//注我们只在开发环境下启用Redux DevTools。运行程序，打开chrome浏览器开发者根据窗口，选择Redux标签页，既可看到Redux DevTools的效果。