环境安装

开发 React Native 之前首先要安装环境，目前有两种方式可供选择：

• Expo Go
• React Native CLI

这两种方式一个是精简版，一个是完全版，具体区别如下介绍。

Expo Go

Expo Go 提供了一个 APP 来运行 React Native 项目，创建的代码也不包含原生代码，相当于帮我们屏蔽了原生环境，让我们专注于 React Native 代码，非常适合初学者。

首先下载 Expo Go APP。

然后创建项目，在终端执行命令：

$ yarn create expo-app ExpoApp

$ cd ExpoApp
$ yarn start

React Native CLI

如果你熟悉原生开发，或者需要完整版的 React Native（包括 Android、iOS 代码），那么必须使用 React Native CLI 创建项目。

使用这种方式请做好繁琐的安装原生环境准备。首先在 Mac 中安装 Node.js 和 Watchman：

$ brew install node
$ brew install watchman

接着分别安装 Android 和 iOS 环境。如果只需要 Android 那么安装 Android 环境即可。

Android 环境

首先安装 JDK，官方建议的版本是 JDK11。

$ brew tap homebrew/cask-versions
$ brew install --cask zulu11

安装完成后测试 javac -version 命令返回是否正常。

接着下载和安装 Android Studio。该软件时 Android 开发者工具，也可以安装和配置 Android SDK。我们安装的 Android SDK 版本为 26 和 31。

确认安装，Android Studio 默认会把 SDK 安装在 ~/Library/Android/sdk 目录下。

接下来，要配置环境变量了。shell 终端与对应的配置文件如下：

• bash：～/.bash_profile
• zsh：~/.zshrc

确认自己电脑的终端类型，打开配置文件，写入以下环境变量：

export ANDROID_SDK_ROOT=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_SDK_ROOT/emulator
export PATH=$PATH:$ANDROID_SDK_ROOT/platform-tools

最后一步，创建基于 TypeScript 的 React Native 项目：

$ npx react-native init RNative --template react-native-template-typescript

创建之后，我们打开项目，找到 android/gradle/wrapper/gradle-wrapper.properties 文件，修改 distributionUrl 的值为下：

https\://services.gradle.org/distributions/gradle-7.4-all.zip

这步操作是为了将 gradle 的版本锁定到 7.4，否则它总是下载最新版。

这一步修改完，就可以尝试编译 Android 应用了：

$ yarn run android

这一步会安装 gradle7.4 的依赖，并打包构建 App。

可能会用到的 gradle 命令：

• ./gradlew cleanBuildCache：清除 gradle 缓存。
• ./gradlew --stop：杀掉 gradle 进程。