寫代碼,好的編碼工具是必不可少的.經(jīng)做web前端的同事推薦選用WebStorm，WebStorm是jetbrains公司旗下一款JavaScript開發(fā)工具.被廣大中國JS開發(fā)者譽為"Web前端開發(fā)神器".但是好像要收費的,可以考慮下破解版.

配置之前,先把之前創(chuàng)建好的HelloWord項目導(dǎo)入.(未創(chuàng)建項目可以參考上一篇:入坑 React native 之開發(fā)環(huán)境搭建)

jsx語法設(shè)置

JSX (Javascript XML syntax transform) 是使用XML語法編寫Javascript的一套解析工具；

X代表XML；也可以理解為擴展(eXtension)，因為實現(xiàn)JSX功能本身就是使用Javascript；

File->Default Settings

Languages&Framworks->JavaScript

然后Apply/OK jsx配置完成。

代碼自動補全功能配置

點擊 WebStorm->Preferences?

快捷鍵:command+,

進入后Libraries->Download 進行選擇需要插件

下載插件

我們就選擇react-DefinitelyGTyped,react-native-DefinitelyTyped 即可

下載并安裝

Apply/OK 補全代碼功能配置完成。

react-native運行方案配置

WebStorm這個IDE直接完成編碼+運行項目工作.這樣就可以不用打開Xcode了.

npm 基本配置

Edit Configurations

進入配置畫面點擊+號并選擇npm

npm

配置npm, command 寫入 help

配置npm

點擊 RunExternal tool

添加運行工具

配置信息后 Apply / OK 即可.

配置運行工具

Name:運行按鈕的名字, 隨便起一個就可以了.

Program: react Native的路徑,一般都是? /usr/local/bin/react-native (終端命令:which react-native)

Parameters: run-ios

working directory: 先點擊右邊的insert macro,選擇"ProjectFileDir - The directory of the project file."

運行

點擊運行,出現(xiàn)如下畫面運行成功.

運行成功

配置已完成

WebStorm 配置完成!