在应用模拟器中运行React Native应用时,如何对其进行调试?
在应用模拟器中运行React Native应用时,如何对其进行调试?
~ npm start
~ npx react-native run-android
~ adb shell input keyevent 82 //debugger command or shake the device to alternate to this command
~ npx react-native run-android //to run the app because adb need this command to start debugger in browser
To Deactivate Debugger:-
~ adb shell input keyevent 82 //debugger command or shake the device to alternate to this command
如果你想了解如何检查网络流量并理解本地UI视图层次结构,那么React Native更新版本提供了开发者工具来调试移动应用程序,同时还具有可扩展的插件API。
Flipper是一个非常好的开发者工具,用于调试移动应用程序。该工具已经随React Native 62一起发布。
你可以使用 Expo 进行调试:https://expo.io/
Expo 允许 Web 开发人员通过仅编写 JavaScript 一次性构建适用于 iOS 和 Android 的真正本地应用程序。它是开源的、免费的,并且使用 React Native。
这是一个很棒的工具,你可以在 React Europe 大会上观看这个研讨会:
在Windows平台并使用Android模拟器,您可以执行以下步骤:
此外,您应该使用console.log()
功能使调试过程更加描述性。
你可以从brew安装React Native Debugger。它比Chrome中的调试器更加舒适易用。
这真的取决于我正在做什么。如果我正在进行UI更改或调试UI,我通常会打开实时和热重载,然后进行更改,然后立即得到反馈。如果是更技术性的问题,我会打开JS调试来查看应用程序的状态。但是由于在React Native中重新加载非常快,如果状态太混乱,我只需使用控制台记录日志。
react-native log-ios
或 react-native log-android
进行调试(它也适用于模拟器)。React Native Debugger。它帮助我解决了90%的问题。
react-native log-android
或react-native log-android
来查看开发模式下应用程序的日志。react-native log-ios
。 - Grzegorz Pawlikconst TAG = 'APP_NAME+SCREEN_NAME';
然后在需要的地方,我会这样做:console.log(TAG + 'ACTION');
这样,我就可以跟踪操作并查看日志语句来自哪里。