学习react-native-debugger

作者 likaiqiang 日期 2018-11-26
学习react-native-debugger

前言

受知乎大神安利,尝试在项目中使用react-native-debugger,经过几天的折腾,果然功能强大。

安装与使用

$ brew update && brew cask install react-native-debugger

mac上使用brew安装react-native-debugger

$ open "rndebugger://set-debugger-loc?host=localhost&port=8081"

打开react-native-debugger。运行react-native项目,手机摇一摇,启动js-debugge,发送到浏览器的调试请求会被react-native-debugger拦截,这样就能使用Console/Network/Sources/Memory四大面板了。

Network

使用之前需要在调试面板上右击,enable network,然后就能看到http请求了,在也不用把每条请求console.log出来了。

调试react

更改setupDevtools.js

更改host为本机ip(可能rn版本不一致,host位置不一样,但是大同小异),然后重新npm start。

调试redux

安装redux-devtools-extension

按照官网教程更改你的store,重新npm start