ReactNative环境搭建

步骤#

2.开发工具#

• 2-1.安装Xcode、Android Studio

  • Mac(Xcode)<开发ios用>Xcode，必须用Mac开发。
  • Android Studio比较麻烦一些
    • 官方做法：https://developer.android.com (在不翻墙的情况下到该地址下载Android Studio)
    • 非官方做法：百度Android Studio，即可下载

• 2-2.工具任意以下其中之一

  • webstore(推荐使用，代码跟踪、代码提示做的比较好)
  • Visual Studio Code
  • Atom

• 2-3.语法设置

  • 会用react的人都知道，react是使用JSX语法，而ReactNative也是使用JSX语法，在webstore中需要设置成react JSX，否则会有很多报错

    

    “webstore打开设置窗口”

    

    “JSX语法设置”

• 2-4.推荐使用Vim编辑器

  • 可结合webstore/Visual Studio Code/Atom 这三款工具使用，特点就是快。

3.难点#

• 3-1.什么是Android SDK

• 3-2.SDK安装步骤

  • 1. 在AndroidStudio中点开偏好
  • 2. 在搜索框中输入Android SDK
  • 3. 然后勾选需要安装的SDK工具
  • 4. 在SDK Platforms窗口中，选择Show Package Details,然后在Android6.0(Marshmallow)中勾选Google Apis、Android SDK Platform 23、Intel x86 Atom64 System Image以及Google APIs intel x86 Atom64 System Image
  • 5. 在SDK Tools窗口中，选择Show Package Details，然后在Android SDK Build Tools中勾选Android SDK Build-Tools 23.0.1
  • 6. 配置ANDROID_HOME环境变量
    • 在MacOS下，在~/.bash_profile中添加

    1
    export ANDROID_HOME=~/Library/Android/sdk
    2
    export PATH=${PATH}:${ANDROID_HOME}/tools
    3
    export PATH=${PATH}:${ANDROID_HOME}/platform-tools

    • 在Linux下需要在.bashrc中添加相应内容
    • 在windows下参考https://jingyan.baidu.com/article/f3e34a128dc9aff5eb6535dc.html

• 3-3.Android模拟器

  • 建议使用Genymotion(建议)
    • 建议使用Genymotion官网注册一个账号(注意，他不认数字的邮箱，必须是字母的)
    • 下载一个genymotion软件
    • 个人版是免费的，企业版收费
    • Genymotio实际用的是virtualbox
  • Android Studio自带的AVD(不建议)
    • 如果要在Android Studio中使用AVD必须安装HAXM否则会慢，可以在Android Studio中配置，首先需要安装(配置过程及其复杂)
      • 大概需要安装的有:Android SDK、Android SDK Platform、Performance (Intel ® HAXM)、Android Virtual Device

• 3-4.windows下配置特别提醒

  • windows下配置较为困难，如果配置完成后发现红屏幕，有各种各样的原因，其中在windows7下通常需要设置Virtualbox的网络最为棘手。