关于开发调试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