当应用程序在应用模拟器中运行时,如何用React Native调试他们的React代码?


当前回答

React本机调试器。它帮我解决了90%的问题

其他回答

在Windows中,使用android模拟器,你可以执行以下步骤:

模拟器运行后,应用程序在它上面,按下菜单按钮,然后选择“调试JS远程”或“调试在Chrome中”(这取决于模拟器使用)。你可以看到下一个图像作为参考:模拟器的步骤图像 一个新的Chrome标签将出现。你必须按Ctrl + J来显示开发人员工具,并开始跟踪调试步骤。请看这张图片作为参考

此外,您应该使用console.log()特性来使调试过程更具描述性。

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

如果你在React原生应用程序开发中使用Atom编辑器中的Nuclide,那么你也可以使用“元素检查器”,这有助于观察开发阶段应用程序在设备上运行时的道具和状态值变化。

在这里了解更多

使用可视化代码工作室调试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

如果你想了解检查网络流量和理解原生UI视图层次结构。通过其可扩展的插件API, React Native Update版本为调试移动应用程序提供了开发人员工具。

Flipper是一个调试移动应用程序的很棒的开发工具。该工具随react-native 62一起发布