window系统下React Native开发环境搭建
1.下载安装jdk
1)下载jdk
打开下载地址http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
根据自己的电脑配置选择相应的版本到自己的安装目录,如下图所示
点击安装,安装步骤如下
这里不要安装到C盘,自己在其他盘建一个文件夹,我这里的路径如下图所示(要记得jdk的安装目录,后面会用到)
这步是下载jre,自己新建一个目录存放,我的如图所示
2)接下来配置jdk的环境变量
我的电脑->右键->属性->高级系统设置->环境变量
在系统变量下新建一个环境变量名称为JAVA_HOME,变量值为当前安装JDK的目录
系统变量中,点击Path变量,并将 ;%JAVA_HOME%\bin; %JAVA_HOME%\jre\bin;追加到变量值后面
确定以后检测是否安装成功 win+R 输入cmd 打开命令行工具后输入java -version
如果出现上图结果,则表示安装成功。
2.下载安装SDK
1)下载sdk
打开下载地址http://www.androiddevtools.cn/出现如下界面
点击Android SDK工具下的SDK Tools进入这个页面
这里我根据自己的系统选择了下载了这个压缩包,并解压到自己建的文件下,里面有这几个文件夹
打开SDK Manager下载,根据需要选择API版本,可以先下载最新的API,后面根据需要再下载,下载成功以后后面staus会变成
Installed,我这个是之前下好的状态,装的时间会有点久。
2)设置sdk的环境变量
新建一个系统环境变量,变量名为ANDROID_SDK_HOME,变量值为你的SDK安装路径(一定得找对sdk的安装路径,否则后面会有问题),如图所示:
把 ;%ANDROID_SDK_HOME%\platform-tools;%ANDROID_SDK_HOME%\tools添加到Path环境变量中。
3)检测是否安装成功 在命令行输入 adb version
3.安装nodejs
写到这里犯懒了,放个安装教程链接吧点击打开链接
4.安装git
再放个安装教程链接好了:点击打开链接
5.下载安装android stuodio
去这个网站http://www.android-studio.org/,一步一步安装即可。
6.安装react native
node -v 检查是否安装node
npm -v 检查是否安装npm
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global 利用国内淘宝镜像加快安装速度
npm install -g react-native-cli 安装react native
如图所示
新建一个项目试试 react-native init 项目名称
出现上图则表示建项目成功
接下来运行这个项目,可以在真机或者模拟器上运行,这里选择模拟器运行
在这之前先手动安装gradle加快运行速度,安装过程如下:
下载安装gradle
从官网下载gradle
下载完解压到自己的目录,然后配置gradle的环境变量,如下图所示
新建系统变量,GRADLE_HOME 变量值为gradle的安装目录
然后编辑系统变量path,添加;%GRADLE_HOME%\bin,如下图所示
最后检查一下是否安装成功,命令行输入gradle -v ,结果如图,则表示gradle已经安装成功。
用webstorm打开项目,在终端输入react-native run-android,运行项目
在这之前还要下载一个夜神模拟器,下载完直接安装,然后打开终端输入adb.exe connect 127.0.0.1:62001
然后设置自己的IP地址加8081端口
设置完以后点返回键,然后Reload一下
出现以上界面,React Native的环境就算搭建完了。
第一次这么认真的写篇博客了,虽然中间还犯懒啦哈哈哈,,
现将搭建RN开发环境过程中遇到几个坑做个总结:
1.设置环境变量的时候,变量值一定要找对路径
2.JDK的版本要是1.8版本的
3.一台电脑只能装一个JDk版本,有多余得到要卸载掉,不然后面运行项目会报错
3.gradle版本和JDK版本,不能一高一低,否则也会报错
4.每个项目用到的API版本不一样,可以在android/src/bulid.gradle 文件中找到对应的API,再到SDK中进行下载。
5.每次安装都有新感觉,遇到问题多多百度就是啦哈哈。
以上是 window系统下React Native开发环境搭建 的全部内容, 来源链接: utcz.com/z/382914.html