必须安装的依赖有:Node、React Native 命令行工具、Python2(这个不知道有啥用,知道的解答下) 以及 JDK 和 Android Studio。
1. 安装Node
安装了Node才能使用包管理器。可以去Node官网下载,安装时一直默认下一步就行。要注意 Node 的版本必须大于等于 10。安装后在cmd命令提示符中输入node --version查看node版本测试是否安装成功。
2. 安装Python2
可以在python官网下载https://www.python.org/downloads/,默认安装即可。注意Python 的版本必须为 2.x(不支持 3.x)。
3. 安装JDK
在https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
下载安装。JDK安装后需要配置环境变量。
右击“我的电脑”–>“属性”–>“高级系统设置”–>“高级”–>“环境变量”
1)在系统变量里新建"JAVA_HOME"变量,变量值为:C:\Program Files\Java\jdk1.8.0_60(根据自己的jdk的安装路径填写)
2)在系统变量里新建"classpath"变量,变量值为:.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\tools.jar (注意最前面有一点)
3)找到path变量(已存在不用新建)添加变量值: %JAVA_HOME%\bin;%JAVA_HOME%\jre\bin
注意变量值之间用";“隔开。注意原来Path的变量值末尾有没有;号,如果没有,先输入;号再输入。如果你的系统是Windows10,就相对方便多了,不用担心这个”;"。
配置完成后,在cmd中输入java -version,如果显示jdk版本信息就说明环境变量配置成功了。
4. 安装Android Studio
首先下载和安装 Android Studio,安装界面中选择"Custom"选项,确保选中了以下几项:
- Android SDK
- Android SDK Platform
- Performance (Intel ® HAXM) (AMD处理器看这里)
- Android Virtual Device
成功后打开软件:
4.1. 安装 Android SDK
你可以在 Android Studio 的欢迎界面中找到 SDK Manager。点击"Configure",然后就能看到"SDK Manager"。
在 SDK Manager 中选择"SDK Platforms"选项卡,然后在右下角勾选"Show Package Details"。展开Android 9 (Pie)选项,确保勾选了下面这些组件(重申你必须使用稳定的翻墙工具,否则可能都看不到这个界面):
- Android SDK Platform 28
- Intel x86 Atom_64 System Image(官方模拟器镜像文件,使用非官方模拟器不需要安装此组件)
然后点击"SDK Tools"选项卡,同样勾中右下角的"Show Package Details"。展开"Android SDK Build-Tools"选项,确保选中了 React Native 所必须的28.0.3版本。你可以同时安装多个其他版本。
最后点击"Apply"来下载和安装这些组件。
4.2. 配置环境变量
React Native 需要通过环境变量来了解你的 Android SDK 装在什么路径,从而正常进行编译。
4.2.1. 配置ANDROID_HOME环境变量
打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 系统变量 -> 新建,创建一个名为ANDROID_HOME的环境变量(系统或用户变量均可),指向你的 Android SDK 所在的目录(具体的路径可能和下图不一致,请自行确认):
你可以在 Android Studio 的"Preferences"菜单中查看 SDK 的真实路径,具体是Appearance & Behavior → System Settings → Android SDK。
你需要关闭现有的命令符提示窗口然后重新打开,这样新的环境变量才能生效。
SDK 默认是安装在下面的目录:
c:\Users\你的用户名\AppData\Local\Android\Sdk
4.2.2. 把 platform-tools 目录添加到环境变量 Path 中
打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 系统变量,选中Path变量,然后点击编辑。点击新建然后把 platform-tools 目录路径添加进去。
此目录的默认路径为:
c:\Users\你的用户名\AppData\Local\Android\Sdk\platform-tools
5. 安装React Native 的命令行工具(react-native-cli)
npm install -g react-native-cli
如果下载慢,可以npm install -g yarn
安装完 yarn 后同理也要设置镜像源:
yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global
安装完 yarn 之后就可以用 yarn 代替 npm 了,例如用yarn代替npm install命令,用yarn add 某第三方库名代替npm install 某第三方库名。
6.创建新项目并运行demo
使用 React Native 命令行工具来创建一个名为"AwesomeProject"的新项目:
react-native init AwesomeProject
6.1准备 Android 设备
你需要准备一台 Android 设备来运行 React Native Android 应用。这里所指的设备既可以是真机,也可以是模拟器。
- 使用 Android 真机
你也可以使用 Android 真机来代替模拟器进行开发,只需用 usb 数据线连接到电脑,然后遵照在设备上运行这篇文档的说明操作即可。
- 使用 Android 模拟器
你可以使用 Android Studio 打开项目下的"android"目录,然后可以使用"AVD Manager"来查看可用的虚拟设备,它的图标看起来像下面这样:
如果你刚刚才安装 Android Studio,那么可能需要先创建一个虚拟设备。点击"Create Virtual Device…",然后选择所需的设备类型并点击"Next",然后选择Pie API Level 28 image.
然后点击"Next"和"Finish"来完成虚拟设备的创建。现在你应该可以点击虚拟设备旁的绿色三角按钮来启动它了,启动完后我们可以尝试运行应用。
6.2编译并运行 React Native 应用
确保你先运行了模拟器或者连接了真机,然后在你的项目目录中运行react-native run-android
:
cd AwesomeProject
react-native run-android
如果配置没有问题,你应该可以看到应用自动安装到设备上并开始运行。注意第一次运行时需要下载大量编译依赖,耗时可能数十分钟。
按两下 R 键,或是按Ctrl+M在开发者菜单中选择 Reload,就可以看到你的最新修改。
7.百度网盘RN环境下载
链接:https://pan.baidu.com/s/1vLrBaMzZd1TwHn0B9n3LSA
提取码:5njb