目录
1. 前言
最近在搭建Windows 和Mac 环境下的RN 开发环境,Windwos 的比较扯蛋,Mac 下基本上按照官网文档一路操作下来没啥问题;
记录一下Windows 环境下的配置,其实也就是拿官方中文的那个简单摘录一下;
2. 说明
必备的依赖项:
- Node(v10.16.2,要求 >10.x.x);
- React Native 命令行工具;
- Python(2.x, 不支持3.x);
- JDK(仅1.8);
- Android Studio;
注意:
Node 的版本必须大于等于 10,Python 的版本必须为 2.x(不支持 3.x),而 JDK 的版本必须是 1.8(目前不支持 1.9 及更高版本)。安装完 Node 后建议设置 npm 镜像以加速后面的过程(或使用科学上网工具)。
3. 步骤
- 建议直接使用搜索引擎搜索下载 Node 、Python2 和Java SE Development Kit (JDK);
- 设置npm镜像
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
- Yarn、React Native 的命令行工具(react-native-cli)
Yarn是 Facebook 提供的替代 npm 的工具,可以加速 node 模块的下载。React Native 的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务。
npm install -g yarn react-native-cli
安装完 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 某第三方库名
。
- Android 开发环境
首先下载和安装 Android Studio,然后安装Android SDK,配置ANDROID_HOME 环境变量
Android SDK
Android SDK Platform
Performance (Intel ® HAXM)
(AMD 处理器看这里)Android Virtual Device
4. 创建项目
使用 React Native 命令行工具来创建一个名为"AwesomeProject"的新项目:
react-native init AwesomeProject
提示:你可以使用--version
参数(注意是两
个杠)创建指定版本的项目。例如react-native init MyApp --version 0.44.3
。注意版本号必须精确到两个小数点。
如果你是想把 React Native 集成到现有的原生项目中,则步骤完全不同,请参考集成到现有原生应用。
5. 编译并运行 React Native 应用
确保你先运行了模拟器或者连接了真机,然后在你的项目目录中运行react-native run-android
:
cd AwesomeProject
react-native run-android
然后基本的配置也就这些,运行成功后,如下图所示: