- 开发过程中，掌握调试技巧是每一个开发者的必修课。熟练的掌握调试技巧不仅可以加快开发速度，而且还可以达到事半功倍的效果。
再次在iOS平台运行RN项目
- 如果开发者已经在设备上运行过RN项目，当再次开启电脑时不需要再次使用Xcode来编译项目。只需打开终端并cd到React-Native项目的根目录下，执行命令：
react-native start。带待改命令执行完毕后，在设备上启动已经安装过的RN应用。RN应用能与开发者电脑上的调试服务器相连，启动成功。 - 因为使用Xcode在iPhone真机上调试项目的启动时间比较久（从用户按下运行按钮到项目开始在手机上运行）。这也正是RN项目相对于原生项目的一大优点。只需要编译一次，以后修改RN代码后，不需要再编译项目，直接在手机上运行原来编译安装的项目，然后可以马上加载新代码。通过这种方式，可以大幅度减少等待时间，提高开发调试效率。
- 如果涉及了原生代码的修改与添加，还是需要使用Xcode来编译运行项目；如果你的苹果被分配了与上次运行时不同的IP地址（这通常发生在电脑重启后），那么还是需要使用Xcode来编译项目一次。
调试
- 调试应用菜单
Android平台可以通过收的menu键或者摇晃手机来弹出调试菜单。iOS真机设备可以通过摇晃真机来弹出菜单。iOS模拟器则可以用快捷键
command + D来弹出调试菜单。-
开发者在使用iOS模拟器是，有时会不小心按了
command + T快捷键。这个快捷键会启动慢镜头动画调试功能——这是一个在调试动画时非常有用的功能。不调试动画时，慢镜头动画功能会让开发者调试等待时间很长，难以忍受。再次按一下command + T快捷键，就可以关闭慢镜头动画调试功能了。
IMG_0227.PNG -
如上图调出调试菜单，选择
Debug JS Remotely菜单项，Chrome浏览器会自动启动并打开一个React Native Debugger页面。如下图：
C8A47BF3-8A26-4C4B-BBA5-DEE74B4D5508.png -
在苹果操作系统下使用快捷键
command + option + J打开如下图界面：
BB615B27-433E-4243-ACD0-390B48EE63A8.png
- 断点调试
-
如下图所示，先把RN的工程文件添加到工具中。2F775282-FBCC-45EC-B77E-4067FEC6F4AC.png
-
添加了RN工程文件如图：FDA5A216-3234-4FA8-B686-6C59B281D204.png
-
在需要调试的地方加断点。
* 注意此时已经执行到断点并且停止执行了，输出台打印了断点前一行的日志，断点及断点后的代码没有执行。此时开发者吧鼠标指向代码中的某个变量，就会显示当前这个变量的值。7569B8E0-6AC9-4CBE-9FED-DFF7F1DF3158.png
上图中右上方一排的六个按钮是断点调试中经常用到的工具。分别是（移到按钮上会显示按钮的作用）：
（1）Resume script execution（快捷键Ctrl + \）,继续执代码；
（2）Step over next function call（快捷键Ctrl + ‘），单步执行当前代码，执行时遇到子函数时不进入子函数内单步执行，而是将子函数执行完后在停止。在不存在子函数的情况下与“Step out current function call ”按钮效果一样。
（3）Step into next function call（快捷键Ctrl + ；）,单步执行当前代码，如果遇到子函数就进入子函数并继续单步执行。
（4）Step out current function call（快捷键Ctrl + Shift + ；）,单步执行到子函数内时，按此按钮可以执行完子函数剩下部分，返回到上层函数，等待下一个单步执行。
（5）Deactivate breakpoint（快捷键Ctrl + F8）,使当前断点失效。
（6）Pause on exceptions，这个按钮时一个开关，当它有效时，按钮会变为蓝色，无效时为灰色。当它有效时，如果RN代码抛出了异常，调试工具会马上暂停代码的运行，进入单步调试模式，方便开发者调试。这个功能对调试非常有用。
在 Pause on exceptions 按钮上方，有一个三个点的按钮，点击这个按钮，会出现弹出菜单，其中的 “show console drawer” 子菜单可以在这个页面底部打开控制台输出的小窗口。
-
如下图所示，先把RN的工程文件添加到工具中。
- 控制台
在代码中，我们除了可以使用
console.log函数在调试工具中记录日志外，还可以使用console.warn函数。这个函数的用法与 log 类似。与 log 相比，它有两处不同：
（1）在调试工具的控制台中输出的姿势醒目的红色。
（2）同时在手机屏幕上有黄色警告条。最后说很重要的一点：使用
console.log记录日志对RN应用的性能有影响，将来开发者在调试RN应用时，如果发现莫名其妙的红屏，首先应该考虑的是自己的日志记录是否太多。在RN生命周期函数中使用console.log打印日志尤其容易引发问题。解决这个问题有两个办法：
（1）使用高配置的手机进行调试，手机的CPU速度快，就不会出这个问题。
（2）只打印必须的日志。同时，RN应用在发包时，不会自动关闭console.log。因此在应用正式发布前，需要把代码中所有的console.log语句删除或者注释掉。
