Windows环境下搭建React Native
隨著移動開發越來越火熱,前端開發也是有之前11年一直火熱到現在,不過我發現從去年年底開發,Android和ios基本已經飽和了,特別是隨著廣大開源社區的中很多人貢獻代碼,開發已經不是什么問題了,所以現在好多公司招聘 都要求3年以上工作經驗的,無外乎好多培訓班出來的會寫一些功能,會寫一些界面實現,就出來上班了,但是深層次到framwork層,能夠深入了解原理的還是少數,特別是當我們的項目遇到瓶頸之后,才能去看看你們怎么實現的。廢話說道這里。
接下來我想說說面試,往往人家會要求會一點js,會一點html5,會react native開發。
下載Nodejs開發包
下載地址:https://nodejs.org/en/,然后默認安裝就行,可以通過node -v的命令來測試NodeJS是否安裝成功。
安裝React-native需要用到git
如果沒有配置git,需要先下載對應的客戶端,然后將git加入path環境變量即可
下載地址:https://git-for-windows.github.io/
安裝react-native命令行工具react-native-cli
https://github.com/facebook/react-native
將react-native-cli克隆到某個盤,使用git客戶端輸入命令:
git clonehttps://github.com/facebook/react-native.git
克隆成功之后
進入剛剛目錄下的react-native目錄下的react-native-cli目錄,輸入npm install –g
安裝成功之后
代碼開發工具
由于React Native沒有任何代碼編輯工具IDE,意思是它強大到用任何一個文本軟件都可以進行開發,這里我推薦使用Sublime Text3作為React Native開發的IDE。下載鏈接:
https://www.sublimetext.com/3
這是一款免安裝的軟件,注意,請確認Sublime是否安裝有JsFormat插件
安裝插件包
軟件安裝好了之后,我們來安裝一個插件,推薦使用package control組件來安裝插件,很方便。
Package Control 的官網地址:https://packagecontrol.io/
不明白的可以google查詢,
我這里用的是漢化的開發工具,已經幫我集成了。接下來怎么安裝插件
請訪問http://blog.csdn.net/xiangzhihong8/article/details/51870777
進入你希望創建項目的目錄后,輸入react-native init AwesomeProject,等待一段時間(較慢)
成功后:
目錄結構:
7、運行package
在命令行中進入項目目錄,輸入react-native start,等待一段時間:
這時候可以用瀏覽器訪問http://localhost:8081/index.android.bundle?platform=android,如果可以訪問表示服務器端已經可以了。
?
7、運行項目
剛剛運行package的命令行不要關閉,重新啟動一個新的命令行,
進入項目目錄,輸入react-native run-android
等待運行(如果是第一次運行,首先會下載gradle,時間較長)
運行成功后出現下圖
第一次手機肯定報錯
這時候我們搖一搖手機,點擊Dev Settings后,點擊Debug server host & port for device,設置IP和端口
“搖一搖”這個動作在模擬器可以用ctrl+M (Menu)來調出Dev setting菜單。
? ? ? ? ?
這里的IP是電腦的IP,不知道的可以在命令行中輸入ipconfig進行查詢,端口號固定8081
設置完成后,回到空白頁面,再次搖一搖手機,選擇Reload JS,程序就運行起來,出現Welcome to React Native!
? ? ? ??
總結
以上是生活随笔為你收集整理的Windows环境下搭建React Native的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: RedHat6.5 搭建glusterf
- 下一篇: redis(7)、redis持久化