【React Native 學習】mac 環(huán)境搭建

最近開始 RN 的學習,將過程記錄為【React Native 學習】,方便自己之后查閱,其他初學 RN 的小伙伴也可以參考;

以下為 mac 系統(tǒng) RN 開發(fā)環(huán)境搭建過程,比較簡單

環(huán)境搭建

RN 開發(fā)必須要安裝的依賴項:Node、Watchman、Xcode 和 CocoaPods

Node & Watchman

直接采用 homebrew 進行安裝,mac 系統(tǒng)一般都自帶 brew 的,如沒有可自行百度安裝;

// 安裝 node
brew install node

// 安裝 watchman
brew install watchman

安裝 node 后,可將 npm 鏡像改為淘寶源,以方便后續(xù)更新(或采用科學上網(wǎng)工具)

// npm 切換淘寶源
npx nrm use taobao

// 切換為官方源
npx nrm use npm

Xcode

Xcode 為 apple 提供的用于開發(fā) mac OS及iOS系統(tǒng)軟件的IDE,可直接在 App Store 進行下載即可;

Cocopods

Cocopods 是一種開源的包管理器,用于管理 iOS 開發(fā)中用到的第三方庫或自行封裝的庫;可通過 brew 安裝

// 安裝 Cocopods
brew install cocopods

之前也曾寫過通過gem安裝、更新 cocopods,請查看:使用cocoa pods管理第三方框架

至此,已滿足創(chuàng)建 react-native 工程的基礎條件,可以打開【終端】進行簡單嘗試;

// 進入工程創(chuàng)建的目錄
cd ~/Desktop

// 創(chuàng)建 HelloReactNative
npx react-native init HelloReactNative    

創(chuàng)建成功,目錄如下:


HelloReactNative.png

上述為創(chuàng)建 RN 工程最基礎的依賴環(huán)境,為更方便、更快捷的進行 RN 開發(fā),還需要安裝一些開發(fā)工具,如下:

yarn

Yarn 是 Facebook 提供的替代 npm 的工具,可以加速 node 模塊的下載。

// 安裝 yarn
npm install -g yarn

安裝完 yarn 之后就可以用 yarn 代替 npm 了,例如用yarn代替npm install命令,用yarn add 某第三方庫名代替npm install 某第三方庫名。

react-native-cli

react-native-cli 是 Node.js 的一個插件,可用于命令行執(zhí)行React Native命令和RN應用啟動時檢查服務端js文件是否更新,以及進行打包服務。

// 安裝 react-native-cli
npm install -g react-native-cli

安裝 react-native-cli 之后,可直接通過命令行執(zhí)行 react-native 相關命令,如:

// 創(chuàng)建工程
react-native init HellReactNative          

WebStorm

WebStorm.png

像網(wǎng)頁、iOS應用、Android應用等開發(fā)一樣,采用 IDE 進行開發(fā)會更便捷,此處大多采用 JetBrains 的 WebStorm 進行 RN 開發(fā),進行過 web、H5 開發(fā)的朋友應該對這款IDE比較熟悉,Android 開發(fā)應該也比較容易上手,和Android Studio 相似度極高(畢竟同一家的產(chǎn)品);


小伙伴們,試試創(chuàng)建一個 React Native 工程吧......

最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容