使用可视化代码工作室调试react原生android和ios应用程序的最佳方法

步骤1。

安装React Native -完整的扩展包

步骤2。

使用USB调试模式连接移动设备或从android工作室打开模拟器。

步骤3。

在可视代码工作室的左侧菜单中单击调试选项 点击添加配置，选择React Native，然后创建launch.json

步骤4。

打开dev选项在手机上的长后按或摇手机和启用调试js远程

第5步。

最后一步点击播放按钮，选择调试android或调试ios

更多信息请参考这个链接

https://medium.com/@tunvirrahmantusher/android-debug-with-vscode-for-react-native-96f54d73462a

在模拟器- react-native Run -ios中运行你的应用程序 按ctrl + d，然后点击Debug JS remote

网页应该在http://localhost:8081/debugger-ui打开，如果没有输入URL，在Chrome中进入这个链接 右键点击页面，点击检查，它应该打开chrome开发工具

转到顶部菜单中的源代码，在右侧的文件资源管理器中找到你的js类文件 您可以将断点放到视图中，并在其中调试代码，如图所示。

在React-Native中，调试要容易得多。

在IOS中使用调试

CMD + d ctrl + cmd + z(用于模拟器)

在android中调试

用触摸摇动设备(确保你的开发者选项是启用的)

在终端adb logcat *:S ReactNative:V ReactNativeJS:V 在Android Studio中打开项目，打开logcat(底部面板上的按钮) 在终端react-native Run -android中运行

构建完成后，您应该在logcat中看到Android Studio中的详细日志。

步骤1: 把调试器放在你想要停止脚本的地方，比如:

  async saveItem(item, selectedValue) {
    debugger
    try {
        await AsyncStorage.setItem(item, selectedValue);
    }
    catch (error) {
        console.error('AsyncStorage error: ' + error.message);
    }
}

这将在控制到达此代码块时暂停调试器。

步骤2: 在ios模拟器上按Cmd+D，在Android模拟器上按Cmd+M。 如果你有真正的设备，摇动设备打开开发菜单，如果你不想摇动设备，请关注这个博客

步骤3: 选择启用远程JS调试，这将打开Chrome

步骤4: 选择开发人员工具。

步骤5: 在源代码中编写调试器的任何地方，调试器都会在Sources选项卡中暂停。进入控制台，输入任何你想调试的参数(出现在代码块中)，例如: 要移动到下一个调试器点，再次移动到Sources ->单击恢复脚本执行按钮(右下角蓝色按钮)

把调试器放在你想暂停脚本的任何地方。

享受调试! !

在react-native的新版本中，您可以使用react-native log-android或react-native log-android查看应用程序在dev模式下的日志。