(四)ReactNative VSCode IDE開發插件

vscode是我個人用過的最舒服的開發工具,同樣,集成了git,支持插件,最主要的是佔用內存小。atom是我開發react native最先用的工具,有酷炫的開發效果,但是最令我不爽的是,佔用內容大,酷炫的插件沒裝幾個就卡的不行。所以個人推薦vscode,讓代碼飛。。。

(一)React Native Tools

該擴展工具(React Native Tools)給React Native項目提供了一個開發環境。你可以調試你的代碼、通過命令面板終端快速的運行react-native命令、並且支持代碼智能補全,對象搜索瀏覽、方法、參數以及其他一些React Native API。

(二)調試

3.1安裝調試環境(Setup debug environment)

在左側菜單中點擊調試圖標 ,然後點擊configure齒輪樣子的圖標來選擇React Native調試環境,以上兩個小圖標的樣式分別如下:
這裏寫圖片描述

VSCode會生成一個launch.json文件保存在項目,同時裏面會有一些默認的數據配置,如下圖所示:
這裏寫圖片描述

上面的配置文件你可以修改這些配置信息,或者往列表中添加新的項。你也可以在這些配置信息中使用其他屬性。
例如:你可以修改target屬性來指定iOS調試的模擬器

3.2.開啓調試(Start debug session)

爲了開始調試,通過配置下拉框選擇一個調試項,然後點擊運行箭頭或者F5按鍵.如下圖所示:
這裏寫圖片描述
你可以調試Android模擬器,Android設備或者iOS模擬器中的應用,當前插件提供iOS設備的支持。有關使用VS Code進行調試的更多詳細信息請點擊查看

3.3使用iOS設備調試(Debugging on iOS Device)

採用iOS設備調試需要完成以下一些常規步驟:

①.在APP中改變jsCodeLocation IP,更多詳細的步驟請點擊查看

②.從調試配置下拉框選擇Debug iOS並且按F5按鍵

③.搖一搖設備,打開開發者菜單,並且選擇”Debug in Chrome”

(三).命令面板終端中使用React Native命令

在命令面板中,可以匹配React Native類型命令,並且選擇命令,如下圖所示:

這裏寫圖片描述

①.運行Android命令,觸發react-native run-android 來進行打開android app

②.運行iOS命令,觸發react-native run-ios來進行打開並且在iOS模擬器中運行(iPhone 6)

③.Packager命令,可以允許我們打開/關閉React-Packager

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章