React Native学习(一)——搭建开发环境

  第一次接触React Native,首先搭建环境,过程还算顺利,不过也遇到了些问题,这里简单记录下来。中文官网(http://reactnative.cn/docs/0.47/getting-started.html#content)

1、下载安装Python2(不支持Python 3)

  • 官网建议使用Chocolatey来安装,但是Chocolatey需要*,所以我是直接下了Python2。

2、下载安装node

  • 这个也是直接下载安装的,原因同上。
  • 安装完node后建议设置npm镜像以加速后面的过程。注意:不要使用cnpm!cnpm安装的模块路径比较奇怪,packager不能正常识别! 
    npm config set registry https://registry.npm.taobao.org --global
    npm config set disturl https://npm.taobao.org/dist --global

3、安装Yarn、React Native的命令行工具(react-native-cli)

  • Yarn是Facebook提供的替代npm的工具,可以加速node模块的下载。
    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

4、下载安装Android Studio(Android Studio2.0或更高版本)

注:需要Java Development Kit [JDK] 1.8或更高版本(可以在命令行中输入 javac -version查看当前JDK版本)

  • 官网下载Android Studio,按默认选项安装;
  • 安装完成后,打开,如下图,选择custom
  • React Native学习(一)——搭建开发环境
  • 检查已安装的组件,尤其是模拟器和HAXM加速驱动。
  • React Native学习(一)——搭建开发环境
  • 都安装好了之后,就到了下图,点击configure-->SDK Manager
  • React Native学习(一)——搭建开发环境
  • SDK Platforms窗口中,选择Show Package Details,然后在Android 6.0 (Marshmallow)中勾选Google APIs、Android SDK Platform 23Intel x86 Atom System ImageIntel x86 Atom_64 System Image以及Google APIs Intel x86 Atom_64 System Image
  • React Native学习(一)——搭建开发环境
  • SDK Tools窗口中,选择Show Package Details,然后在Android SDK Build Tools中勾选Android SDK Build-Tools 23.0.1(必须是这个版本)。然后还要勾选最底部的Android Support Repository.
  • React Native学习(一)——搭建开发环境
  • 配置ANDROID_HOME环境变量,将Android SDK的Tools目录添加到PATH变量中

5、下载安装Genymotion(android模拟器)

  我下载了包含VirtualBox的,但是这样下的VirtualBox不能用(不知道我是不是个例),在网上重新下了一个就好了。进去先注册一下,随便add一个,然后start,就打开了

React Native学习(一)——搭建开发环境

6、测试安装

react-native init AwesomeProject
cd AwesomeProject
react-native run-android

注:要先打开模拟器,我开始不知道,磨叽了好久,报错如下

React Native学习(一)——搭建开发环境

2019/5/27更新------------------------------------------------

注意:我们还需要 JDK(Java SE Development Kit)。另外,Android Studio需要配置的地方也很少了,如果不需要使用官方模拟器,几乎默认安装就可以了。具体参考 https://reactnative.cn/docs/getting-started/ 。

--------------------------------END------------------------------------

上一篇:CentOS 7下MySQL 5.7安装


下一篇:HDU 4786 Fibonacci Tree