ReactNative入門 3 環境配置

2022-02-13 15:55:19 字數 1186 閱讀 7682

(1)需要一台mac(osx),這個是前提,建議還是入手一本啦。

(2)在mac上安裝xcode,建議xcode 6.3以上版本

(3)安裝node.js:

(4)建議安裝watchman,終端命令:brew install watchman

(5)安裝flow:brew install flow

ok,按照以上步驟,你應該已經配置好了環境。

現在我們需要建立乙個react-native的專案,因此可以按照下面的步驟:

開啟終端,開始react-native開發的旅程吧。

(1)安裝命令列工具:sudo npm install -g react-native-cli

(2)建立乙個空專案:react-native init helloworld

(3)找到建立的helloworld專案,雙擊helloworld.xcodeproj即可在xcode中開啟專案。xcodeproj是xcode的專案檔案。

(4)在xcode中,使用快捷鍵cmd + r即可啟動專案。基本的xcode功能可以熟悉,比如模擬器的選擇等。

啟動完成後,你會看到react-packger和ios模擬器,具體的效果如下,說明你建立專案成功了。

四、改改helloworld

xcode裡面的**目錄結構暫時不用管了,開啟helloworld專案資料夾,找到index.ios.js檔案。

index.ios.js檔案就是react-native js 開發之旅的入口檔案了。 先來個感性的認識,修改一

(1)找到**部分:

welcome to react native!

修改成如下:

react-native入門學習

(2)找到**

welcome: ,

修改成如下:

welcome: ,

(3)有web開發經驗的你,上面的修改你一定會體會到些什麼。點選模擬器,cmd + r,重新整理檢視,會看到如下截圖:

四、恭喜你,萬里長征已經走了1000步

如果有過web開發經驗的你,一定覺得很容易理解和學習react-native,所以這一小步也是一大步

(1000步)。千里之行,始於此步。

Windows下React Native環境配置

1.安裝nodejs並配置 映象 npm config set registry global npm config set disturl global 2.安裝windows上的包管理器chocolatey powershell noprofile executionpolicy bypass ...

Mac上搭建React Native開發環境

前面我們介紹過在window環境下開發react native專案,今天說說怎麼在mac上搭建乙個rn的開發環境。然後一路回車 最後出現success,就表示安裝成功了。安裝完成後,可以用brew doctor命令檢測下是否有什麼衝突的地方。關於homebrew其他的介紹可以自行檢視官網資料。rea...

react native學習之入門app

1 專案初始化 react native init myproject 2 啟動專案 cd myproject react native start 新開cmd視窗 react native run android 3 源 分析 附上index.android.js檔案 import react,f...