最近开始 RN 的学习,将过程记录为【React Native 学习】,方便自己之后查阅,其他初学 RN 的小伙伴也可以参考;
以下为 mac 系统 RN 开发环境搭建过程,比较简单
环境搭建
RN 开发必须要安装的依赖项:Node、Watchman、Xcode 和 CocoaPods
Node & Watchman
直接采用 homebrew 进行安装,mac 系统一般都自带 brew 的,如没有可自行百度安装;
// 安装 node
brew install node
// 安装 watchman
brew install watchman
安装 node 后,可将 npm 镜像改为淘宝源,以方便后续更新(或采用科学上网工具)
// npm 切换淘宝源
npx nrm use taobao
// 切换为官方源
npx nrm use npm
Xcode
Xcode 为 apple 提供的用于开发 mac OS及iOS系统软件的IDE,可直接在 App Store 进行下载即可;
Cocopods
Cocopods 是一种开源的包管理器,用于管理 iOS 开发中用到的第三方库或自行封装的库;可通过 brew 安装
// 安装 Cocopods
brew install cocopods
之前也曾写过通过gem安装、更新 cocopods,请查看:使用cocoa pods管理第三方框架
至此,已满足创建 react-native 工程的基础条件,可以打开【终端】进行简单尝试;
// 进入工程创建的目录
cd ~/Desktop
// 创建 HelloReactNative
npx react-native init HelloReactNative
创建成功,目录如下:
上述为创建 RN 工程最基础的依赖环境,为更方便、更快捷的进行 RN 开发,还需要安装一些开发工具,如下:
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 的一个插件,可用于命令行执行React Native命令和RN应用启动时检查服务端js文件是否更新,以及进行打包服务。
// 安装 react-native-cli
npm install -g react-native-cli
安装 react-native-cli 之后,可直接通过命令行执行 react-native 相关命令,如:
// 创建工程
react-native init HellReactNative
WebStorm
像网页、iOS应用、Android应用等开发一样,采用 IDE 进行开发会更便捷,此处大多采用 JetBrains 的 WebStorm 进行 RN 开发,进行过 web、H5 开发的朋友应该对这款IDE比较熟悉,Android 开发应该也比较容易上手,和Android Studio 相似度极高(毕竟同一家的产品);
小伙伴们,试试创建一个 React Native 工程吧......