React Native macOS Android 搭建开发环境

天大地大妈咪最大 提交于 2019-11-30 08:58:20

这个讲的是React Native完整的原生开发环境。

这个环境的搭配,会根据你使用的操作系统、针对的目标平台不同,具体的搭配步骤就会有所不同;如果想同时开发iOS和Android也是没有问题的,你需要先选一个平台开始,对于另一个平台的环境搭建只是稍有不同。

开发平台:macOS、Windows、Linux       

目标平台:iOS、Android

React Native macOS  Android 搭建开发环境:

(1)安装依赖

必须安装的依赖有:Node、Watchman和React Native命令行工具以及JDK和Android Studio。

虽然可以使用任何的编辑器来开发应用(编写js代码),但你仍然必须安装Android Studio来获得编译Android应用所需的工具和环境。

我们推荐使用Homebrew来安装Node和Watchman,在命令行中执行下列命令:

brew install node
brew install watchman

注意:如果你已经安装了Node,请检查其Node版本是否在v8.3以上;安装完了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

Watchman则是由Facebook提供的监视文件系统变更的工具,安装此工具可以提高开发时的性能(packager可以快速捕捉文件的变化从而实现实时刷新)。

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 某第三方库名。

Java Development Kit

React Native 需要 Java Development Kit [JDK] 1.8(暂不支持 1.9 及更高版本)。你可以在命令行中输入

javac -version来查看你当前安装的 JDK 版本。如果版本不合要求,则可以到 官网上下载。

Android 开发环境

如果你之前没有接触过 Android 的开发环境,那么请做好心理准备,这一过程相当繁琐。请万分仔细地阅读下面的说明,严格对照文档进行配置操作。

译注:请注意!!!国内用户必须必须必须有稳定的翻墙工具,否则在下载、安装、配置过程中会不断遭遇链接超时或断开,无法进行开发工作。某些翻墙工具可能只提供浏览器的代理功能,或只针对特定网站代理等等,请自行研究配置或更换其他软件。总之如果报错中出现有网址,那么 99% 就是无法正常翻墙。

1. 安装 Android Studio

首先下载和安装 Android Studio,国内用户可能无法打开官方链接,请自行使用搜索引擎搜索可用的下载链接。安装界面中选择"Custom"选项,确保选中了以下几项:

  • Android SDK
  • Android SDK Platform
  • Performance (Intel :registered: HAXM)
  • Android Virtual Device

然后点击"Next"来安装选中的组件。

如果选择框是灰的,你也可以先跳过,稍后再来安装这些组件。

安装完成后,看到欢迎界面时,就可以进行下面的操作了。

 

 

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!