React Native的环境配置

JDK的安装:
1.安装
在要安装jdk的目录盘新建Android文件夹,这里以D盘为例
在文件夹中新建java文件夹 ,其中再建jdk和jre文件夹

《React Native的环境配置》

安装jdk,直接双击安装好的安装包,点击下一步

《React Native的环境配置》

修改安装文件夹,更改为刚刚创建的jdk文件夹

《React Native的环境配置》

继续下一步,

《React Native的环境配置》

这里是安装jre,更改安装文件夹,为刚刚创建的jre文件夹

《React Native的环境配置》

继续下一步,出现如下界面,即安装成功

《React Native的环境配置》

2.环境配置

开始 –>控制面板–>系统-和安全–>系统–>高级系统设置

《React Native的环境配置》

《React Native的环境配置》

新建系统变量 JAVA_HOME (必须大写)

《React Native的环境配置》
《React Native的环境配置》

配置jdk和jre环境变量

在系统变量中找到path变量,选中,点击编辑
Win7:在变量值后直接加上;%JAVA_HOME%bin(千万不要删除原来的内容)

《React Native的环境配置》

Win10:
《React Native的环境配置》

测试是否安装成功
在cmd窗口输入java和javac测试,如出现以下界面,即安装成功

《React Native的环境配置》

《React Native的环境配置》

Android SDK
1.两种安装方法:
使用下载好的SDK包(推荐)
使用SDK下载工具,然后自行安装(太大,近50G)
这里使用的是下载好的SDK安装包,下载好的SDK包只需解压到指定目录(刚开始创建的Android文件夹)即可,基本上不需要再安装其他包

解压完,即安装已经OK
2.环境配置
与JDK环境配置类似
新建系统变量 ANDROID_HOME,变量值为刚刚解压完成的SDK目录

《React Native的环境配置》

Win7:
在系统变量中找到path变量,直接添加:(不要删除原来的内容)
%ANDROID_HOME%;%ANDROID_HOME%platform-tools;%ANDROID_HOME%tools;
Win10:

《React Native的环境配置》

连续三次确定,完成配置
完成测试:重启cmd窗口,输入adb测试

《React Native的环境配置》

Node.js
这里我已经安装好了,提供一个教程链接
http://jingyan.baidu.com/arti…

React-native-cli
全局安装如下,在任意位置打开命令行工具,输入 npm install -g React-native-cli,回车

初始化目录

可能会出现………,一直没结果,这里有两种方法:
方式一:在线安装
淘宝做了一个镜像源,每隔10分钟去同步一次,可以使用镜像源来安装
使用nrm工具, 命令行输入 npm install nrm -g 全局安装nrm
输入 nrm 测试是否安装成功(等待事件比较久,跟网速有关)

《React Native的环境配置》

输入nrm ls 查看那些镜像源可以用

《React Native的环境配置》

输入 nrm use taobao 切换镜像源,*表示 当前正在使用的镜像源

《React Native的环境配置》

方式2:直接官网下载好压缩包
http://services.gradle.org/di…
这里下载的是这个压缩包

《React Native的环境配置》

直接将压缩包放在指定文件夹:(Administrator指计算机名称)
注意压缩包不要解压!!!
C:UsersAdministrator.gradlewrapperdistsgradle-2.4-all6r4uqcc6ovnq6ac6s0txzcpc0

初始化:
在Android目录下创建文件夹 apps
进入文件夹,按住shift键,右键打开命令行工具,输入 react-native init Test 来创建我们的第一个项目(Test 为创建项目的名称),等待,出现如下界面即成功

《React Native的环境配置》

连接手机,将手机与电脑连接起来(USB线),手机打开开发者模式,USB调试(不同手机请自行百度打开方式);

运行程序
进入Test目录(命令行 cd Test),输入 react-native run-android等待,手机会自动下载
出现如下界面,即成功

《React Native的环境配置》

其他错误可参考博客:http://www.it610.com/article/…

    原文作者:小寒妮儿
    原文地址: https://segmentfault.com/a/1190000007937871
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞