RN的調試和web端的調試雖然相似，但是也有一些不同，下面就來比較一下三種斷點調試方法的差異
總結： 感覺還是第一種好一些
1.React-Native-Debugger工具調試法
1.1 首先我們得下載一個React Native Debugger的調試軟件
1.2其次，我們找到我們要調試的那個文件，假設這個文件叫做account.js,那么我們打開上面下載的軟件
並且同時按下ctrl + P,這時候會彈出一個輸入框，輸入文本就可以找到我們的account.js
1.3 打開之后，就可以愉快的斷點調試啦，點擊左邊顯示行數的數字的地方，就可以在那一行斷點
1.4 但如果我們的代碼很長，有上千行怎么辦呢？ 好像一時找不到那個文件啊
這時候ctrl + F, 彈出搜索框，按照代碼里的關鍵位置的代碼去搜索就好了，點擊按鈕就會跳到那一行
優缺點描述
- 優點：調試過程不會對代碼有影響
- 缺點： 代碼很長，而且涉及文件多時調試可能繁瑣一些，不能直接在代碼里進行操作
2.VScode插件：React Native tool 進行調試
2.1. 首先在VScode中進行搜索，並且install
2.2 調整配置文件
2.3 點擊左上角的綠色三角形標志進行調試
優缺點描述
- 優點：調試過程不會對代碼有遺留影響，而且能夠直接在項目代碼中調試
- 缺點： 在RN中調試過程將會非常緩慢，和web顯著不同，幾乎要比其他兩種調試方式慢十倍
3.直接在代碼中寫入debugger語句
我們可以直接在項目中寫入debugger語句進行調試
但是項目中的eslint不讓我們debugger怎么辦？
解決方法
- 通過注釋 /*eslint-disabled*/ 禁掉當前文件的no-debugger
- 愉快的進行debugger
- 最后把 /*eslint-disabled*/ 和debugger刪掉就可以了
備注：
- 似乎RN打包時候會自動把debugger刪掉？？？？
- 有個babel插件，可以用來去掉debugger語句 babel-plugin-transform-remove-debugger
優缺點描述
- 優點：直接在項目中調試，方便
- 缺點： 調試過程中可能會遺留多余的代碼（debugger語句忘記刪掉），造成影響