记录 react native 环境搭建过程，rn 迭代速度太快，本文记录 0.67 版本 rn 搭建 android 过程所遇到的坑，本人很多软件卸了再装，装了再卸，😭
下方附上 react native 官方文档

react native官方文档

https://reactnative.cn/docs/getting-started

安装依赖

  1. node，注意 node 的版本应该大于 12 (傻瓜式安装)
    node
  2. jdk，0.67 版本需要的 jdk 版本是 11 版本，查看 jdk 版本 javac -version，低于 0.67 版本的 rn 需要 jdk1.8 版本 (安装后配置环境变量，具体安装教程已经有很多了，这里不多做介绍)
    jdk
  3. android studio
    android studio
  4. python2(之前需要安装py，建议安装)

安装 Android Studio

  1. Android Studio 默认安装最新版本的 sdk，rn 需要 Android 10 (Q)，如果你的真机 android 版本小于 10，你也可以下载其他版本的 sdk
  2. 安装以后，打开 android studio 界面中找到 sdk manager(如果没找到也可以到 setting 中搜索 sdk 找到)
sdk
sdk
  1. 点击 SDK Platforms，勾选 Show Package Details 确保选中 Android 10.0(Q) 下的 Android SDK Platform 29 和 Intel x86 Atom_64 System Image
sdk
sdk
  1. 点击 SDK Tools 选项卡，同样勾中右下角的 Show Package Details 展开 Android SDK Build-Tools 选项，确保选中了 React Native 所必须的 29.0.2 版本，你可以同时安装多个其他版本
sdk
sdk
  1. 还是在 SDK Tools 选项卡，点击 NDK (Side by side)，同样勾中右下角的 Show Package Details，选择 20.1.5948944 版本进行安装
sdk
sdk
  1. 点击 Apply 下载安装这些组件

配置环境变量

  1. React Native 需要通过环境变量来知道 Android SDK 装在什么位置，从而正常编译
sdk安装路径
sdk安装路径
  1. 打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 环境变量 -> 新建，创建一个名为 ANDROID_HOME 的环境变量指向 Android SDK 所在的目录
  2. 添加工具目录到环境变量 path(注意一定要点编辑，否则会冲掉之前的目录)
1
2
3
4
%ANDROID_HOME%\platform-tools
%ANDROID_HOME%\emulator
%ANDROID_HOME%\tools
%ANDROID_HOME%\tools\bin

创建项目

1
npx react-native init MyApp

连接手机

  1. 打开手机的开发者选项
  2. 打开手机的 usb 调试功能
  3. 检测是否正确连接到设备(每次只应当连接一个设备)
1
adb devices
1
2
3
List of devices attached
emulator-5554 offline   # Google emulator
14ed2fcc device         # Physical device

启动项目

1
2
3
yarn android
# 或者
yarn react-native run-android