概述
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的效果。
最后
以上就是超级心锁为你收集整理的Redux的调试工具Redux DevTools的全部内容,希望文章能够帮你解决Redux的调试工具Redux DevTools所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复