mac+react-native環境搭建


主要參考 https://reactnative.cn/docs/getting-started.html react-native中文網

 

IOS版

1、Node v10以上、Watchman 和 React Native 命令行工具以及 Xcode

 

先安裝brew工具,這樣便於后面安裝,第一次安裝可能比較慢,耐心等待。。。

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 安裝完之后,由於默認使用了國外鏡像源,速度較慢,得修改源地址為國內的。

 

1)替換brew.git cd "$(brew --repo)" git remote set-url origin https://mirrors.ustc.edu.cn/brew.git



2)替換homebrew-core.git cd "$(brew --repo)/Library/Taps/homebrew/homebrew-core" git remote set-url origin https://mirrors.ustc.edu.cn/homebrew-core.git

 

安裝node

brew install node  這里可能會提示要你按照依賴包,按照所給出的提示安裝即可

 

安裝watchman

brew  install watchman
同樣也修改鏡像地址 npm config set registry https://registry.npm.taobao.org

--global npm config set disturl https://npm.taobao.org/dist --global

 

2、 React Native 的命令行工具(react-native-cli),Yarn是 Facebook 提供的替代 npm 的工具,安裝完 yarn 之后就可以用 yarn 代替 npm 了,例如用yarn代替npm install命令,用yarn add 某第三方庫名代替npm install 某第三方庫名

npm install -g yarn react-native-cli
修改鏡像地址
yarn config set registry https://registry.npm.taobao.org--global  yarn config set disturl https://npm.taobao.org/dist --global 

 

3、React Native 目前需要Xcode 9.4 或更高版本,APP Store下載即可

 

4、初始化項目

react-native init AwesomeProject

 

5、編譯並運行 React Native 應用

cd AwesomeProject react-native run-ios
注意: 此步驟可能會提示xcrun: error: unable to find utility "instruments", not a developer tool or in PATH錯誤, 解決方法: 1sudo xcode-select -s /Applications/Xcode.app/Contents/Developer/ 命令即可解決此問題 可能會提示Could not find iPhone 6 simulator-- 解決方法: 1、react-native run-ios --simulator="iPhone 6",運行時指定啟動版本 2 、打開項目文件node_modules/react-native/local-cli/runIOS/findMatchingSimulator.js 然后,Check if your device version is correct, e.g: in line 29 console.log(version) 。在文件30行,對比是否是這個條件:Compare it with condition in line 30: if (version.indexOf('iOS') !== 0) { 注釋掉的是version.indexOf('iOS') !== 0,然后替換成 if (version.indexOf('iOS') !== 0 && !version.includes('iOS')) { continue; }

 

6、 再重新執行react-native run-ios --simulator="iPhone 6" 命令,如果成功就可以看到手機模擬運行的效果了

 

 

android版

1、下載adroid studio https://developer.android.google.cn/studio/

2、按照https://reactnative.cn/docs/getting-started.html上面給出的安裝步驟依次操作即可,上面說是要翻牆,但好像不翻也可以!!!

需要注意的地方是在運行項目的時候,得先新建模擬器,不然在react-native run-android執行時,

會出現installDebug FAILED,網上說修改gradle版本,還有改distributionURL參數。本人都沒改,在Android studio 新建好模擬器即可!!!

 

至此,以上就是本人在Mac 10.14.6 搭建react-native的過程及其過程中所遇到的問題,給小伙伴們提供個參考吧。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM