react-native实现多台真机调试

| |

调试工具

react-devtools
与 模拟器中ctrl+m 的 toggle inspector 结合使用，可以调试元素的 props、state、style

多台真机调试

  1. 有线

    1
    2
    3
    4
    5
    6
    7
    react-native run-android // 有线连接一台设备，并输出
    // 或
    adb logcat *:S ReactNative:V ReactNativeJS:V

    adb devices // 输出设备列表，有线连接多台设备，并指定设备号输出log
    adb -s ca759657 logcat -v threadtime *:S ReactNative:V ReactNativeJS:V
    adb -s e5a56695 logcat -v threadtime  *:S ReactNative:V ReactNativeJS:V

  2. 无线
    install apk
    Dev Settings -> Debug server host & post for device -> 本机ip:8081（同一局域网）

log打印

1
2
react-native log-android（相当于adb logcat，用于有线连接）
adb logcat *:S ReactNative:V ReactNativeJS:V

指定设备输出log：

1
2
adb -s ca759657 logcat -v threadtime *:S ReactNative:V ReactNativeJS:V
adb -s e5a56695 logcat -v threadtime  *:S ReactNative:V ReactNativeJS:V

chrome控制台调试：Dev Settings -> Debug js remotely （同一局域网内可无线连接）
热加载：Dev Settings -> Enable Live Reloading, Enable Hot Reloading

参考

防止控制台输出中文乱码

乱码原因：Android中使用的是UTF-8字符，而CMD默认字符集是ANSI，中文环境下即为GBK。

  1. 查看当前编码

    1
    2
    chcp
    // Active code page: 936

  2. 更改代码页

    1
    2
    chcp 65001
    // Active code page: 65001

  3. 更改字体设置
    cmd.exe 右键 -> 属性 -> 字体
    把字体从点阵字体更改为”Lucida Console”字体
    大小调到14

参考1
参考2