如果 React Native 環境搭建完畢
那么下面的這幾篇文章也許能夠幫到你
如何創建 React Native 應用
如何在源生項目中使用 React Native
React Native 如何真機 release 模式運行
React Native 如何用 Pushy 進行熱更新
如果你覺得對你有所幫助, 記得【關注】,感謝支持,后期還會有更新。
一、關于 React Native 的簡單介紹
2015年3月26日 Facebook 在 F8 大會上開源了 React Native
React Native 它可以使用 JavaScript 和 React 開發跨平臺的移動應用。
并且 Facebook 已經在多項產品中使用了React Native,并且將持續地投入建設 React Native。
二、安裝 Homebrew
Homebrew 是 OS X 或者 macOS 的套件管理器,我們可以通過它來獲取并安裝很多組件。
安裝步驟
- 終端執行指令
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
- 使用下面指令查看 homebrew 是否安裝成功
brew -v
三、安裝 Node.js
-
安裝方法一
- 下載 pkg 的安裝包進行安裝 ( 該安裝包已經包含了 npm )
下載地址: https://nodejs.org/dist/v6.9.1/node-v6.9.1.pkg
- 下載 pkg 的安裝包進行安裝 ( 該安裝包已經包含了 npm )
-
安裝方法二
- 使用 homebrew 安裝 Node.js 默認安裝的是最新版本,一般 node 大于 4.0 版本都滿足要求。
brew install node
-
安裝完成后
- 建議設置 npm 鏡像以加速后面的過程(或使用科學上網工具)。
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
四、推薦安裝的工具
1. WatchMan
Watchman 是由Facebook提供的監視文件系統變更的工具。安裝此工具可以提高開發時的性能(packager可以快速捕捉文件的變化從而實現實時刷新)。
使用 homebrew 安裝 watchman
brew install watchman
2. Flow
Flow 是一個靜態的JS類型檢查工具。
譯注:你在很多示例中看到的奇奇怪怪的冒號問號,以及方法參數中像類型一樣的寫法,都是屬于這個flow工具的語法。
這一語法并不屬于ES標準,只是Facebook自家的代碼規范。
所以新手可以直接跳過(即不需要安裝這一工具,也不建議去費力學習flow相關語法)
使用 homebrew 安裝 flow
brew install flow
3. Nuclide
Nuclide (此鏈接需要科學上網)是由 Facebook 提供的基于 atom 的集成開發環境,
可用于編寫、[運行](http://nuclide.io/docs/platforms/react-nativ
e/#running-applications) 和 調試 React Native 應用。
點擊這里閱讀 Nuclide的入門文檔。
譯注:React Native 官網更推薦使用 WebStorm 或 Sublime Text 來編寫 React Native 應用。
3. Yarn、React Native
Yarn 是 Facebook 提供的替代 npm 的工具,可以加速 node 模塊的下載。
React Native 的命令行工具用于執行創建、初始化、更新項目、運行打包服務(packager)等任務。
使用 終端 安裝 React Native
npm install -g yarn react-native-cli
如果你看到 EACCES: permission denied
這樣的權限報錯,
那么請參照上文的 homebrew 譯注,修復 /usr/local 目錄的所有權:
sudo chown -R `whoami` /usr/local
或者直接使用
sudo npm install -g yarn react-native-cli
4. Xcode
React Native 目前需要 Xcode 8.1 或更高版本。
你可以通過App Store或是到 Apple開發者官網上下載。
這一步驟會同時安裝 Xcode IDE 和 Xcode 的命令行工具。
雖然一般來說命令行工具都是默認安裝了,但你最好還是啟動Xcode
并在 Xcode | Preferences | Locations 菜單中檢查一下是否裝有某個版本的 Command Line Tools 的
Xcode 命令行工具中也包含一些必須的工具,比如 git 等。
5. Genymotion (可以不安裝)
Genymotion 是一個第三方模擬器,它比 Google 官方的模擬器更易設置且性能更好。
但是,它只針對個人用戶免費。
- 下載并安裝 Genymotion 打開 Genymotion
- 如果你尚未安裝 VirtualBox 它有可能會提示你安裝
- 創建一個模擬器并啟動
- 按下 ?+M
可以打開開發者菜單(在安裝并啟動了React Native 應用之后)
你也可以在 Nuclide 中打開 AwesomeProject
文件夾 然后 運行,或是雙擊 ios/AwesomeProject.xcodeproj 文件然后在 Xcode 中點擊 Run 按鈕。
或者你可以進行創建一個你自己的 React Native 的應用
如何創建 React Native 應用
如何在源生項目中使用 React Native
React Native 如何真機 release 模式運行
React Native 如何用 Pushy 進行熱更新
如果你覺得對你有所幫助, 可以點贊關注,支持一下,后期還會有更新。