react-native-debugger的使用整理

利用react-native-debugger可以在react-native项目中监听查看和api交互的数据,搜集过程中经历了比较长的时间,现在做了一些整理,希望能帮助到需要的人

一、下载

点击下面链接进行下载release版本,根据需要安装

https://github.com/jhen0409/react-native-debugger/releases

二、运行react-native-debugger

默认打开如下图

react-native-debugger的使用整理

三、切换端口

  1. debugger --> new window 打开新窗口
  2. 输入新的监听端口并确认

四、进行debugger监听

  1. 在RN项目的运行窗口中切换为英文输入,按D键,弹窗开发菜单选项,按R键进行重新加载项目
    react-native-debugger的使用整理

  2. 选择debug选项就可以在rn-debugger中的控制台看到打印信息了
    react-native-debugger的使用整理

五、调整默认配置文件

  1. debugger --> open config file 打开配置文件
  2. 配置文件调整
// 此处仅列出用到的两个配置
{
    ...
    // 默认启动的监听端口
    defaultRNPackagerPorts: [8081],
    // 是否启动network插入监听,默认为false,开启之后可在rn-debugger的network中看到网络请求
    defaultNetworkInspect: true,
    ...
}

react-native-debugger的使用整理
以上就是我所用到的所有的配置,已经达到我的期望,有好的方法欢迎评论

上一篇:js导出数据为excel表


下一篇:Vue(五)——调试