React Native 开发者工具介绍


关于开发调试ReactNative的笔记

React Develop Tool

  • 命令报错 emulator -avd xxx
    原因,不明,但是采用Android API 版本小于28 的就没问题。当然虽然报错,也是可以用的。这个命令一开始无法使用,Android SDK 里面有两个emulator.exe, 一个在 Tools/emulator.exe, 一个在emulators/emulator.exe,可以使用这个命令创建软链接mklink ./emulator.exe ../emulator/emulator.exe
  • 在Android Simulator上打开调试菜单, Ctrl + M, 28版本的镜像没问题。30打不开只能使用adb shell input keyevent 82 或者 matrixbox 去打开。
  • React Native Cli
    • react-native start 这个是启动Metro,Metro,地铁,它是沟通Android设备的核心,同时也是调试的js虚拟机所在。它本质上是一个捆扎器,跟webpack功能类似。平时开发的时候可以通过它来观察到app的运行状态,或者向app发送一些指令例如打开开发者菜单,重新加载等。
    • react-native run-android,这个是用来编译android的代码,同时将app发送到模拟器或者设备中,启动app。
  • Hermes,这个是js 引擎,facebook 开源的针对ReactNative 优化的。跟ios中的JavaScriptCore, chrome中的v8类似。它还是个实验品,提供了ios/android中js 的统一特性。开启方法
    • 非Hermes的调试其实js 运行于开发者电脑中的v8中,
    • Hermes的调试,js是运行于设备中的hermes中。
  • 调试,针对非Hermes,我们可以通过vscode 或者chrome/Edge 来调试,vscode 可以通过attach 到metro上也就是localhost:8081, chrome/Edge 则是通过localhost:8081/debugger-ui,打开console,但是总的来说,vscode 方便一些。如果不灵,可以在虚拟机中debug再开一下就好了。
  • Network Inspector, 先安装openssl,加入环境变量,然后vscode 里面React Native: Run Network Inspector

原创文章,作者:,如若转载,请注明出处:https://blog.ytso.com/273043.html

(0)
上一篇 2022年7月9日
下一篇 2022年7月9日

相关推荐

发表回复

登录后才能评论