目标平台 Android

开发平台 windows

开发环境安装建议:由于开发环境存在差异,建议参照react官网 或者react中文网 安装,

react-native —— 在Windows下搭建React Native Android开发环境也很有参考价值。

安装过程中遇到错误后,查找关键字,解决错误。

开始!

安装:

Chocolatey

CMD.exe

@powershell -NoProfile -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"

安装需要一个稳定的能够翻墙的网络环境



上面错误显示window不能够解压.zip, 实际情况是更换一个稳定翻墙环境就解决了

win8 安装程序时出现2502 2503错误解决方法

  1. 运行CMD(必须用管理员权限)
  2. 输入命令: msiexec /package “你的安装文件的全路径”

参考:win8 安装程序时出现2502 2503错误解决方法

react-native init awesome

初始化项目,很长时间都显示进行中或者失败

解决方案:参考在Windows下搭建React Native Android开发环境

// 直接克隆主分支
git clone https://github.com/facebook/react-native.git
cd react-native/react-native-cli && npm install -g

当执行npm install -g报错 'Error: EPERM: operation not permitted'

Error: EPERM: operation not permitted

显示权限不足,需要获取管理员权限,再次执行

获取管理员权限后,仍是报同样的错误。解决方案参考

How to fix Node.js npm permission problems

第一步:执行npm cache clean;再次在react-native-cli目录下执行npm install -g;如果不成功,

第二步:查看%APPDATA%\npm-cache或者$env:APPDATA\npm-cache不清楚这是什么意思

第三步:第二部清理缓存后,如果还有残留,手动清除。问题解决。

第二步执行过程中,之前运行的react-native init awesome已经初始化成功,没有接着往下试

执行react-native init awesome,初始化项目成功后,会看到



接着选择运行的平台:

如果是IOS:

cd E:\react\awesome
react-native run-ios
或者如上提示

如果是 Android:

cd E:\react\awesome
react-native run-andriod // 执行这一步的时候报错,-bash: XXXX/react-native: No such file or directory

-bash: XXXX/react-native: No such file or directory

执行react-native run-andriod 报错,显示文件不存在

方案:重新获取管理员权限,执行 npm install -g react-native-cli 。再次 react-native run-andriod,完美运行。

Execution failed for task ':app:compileDebugJavaWithJavac'.

Could not find tools.jar

参考:

android - Execution failed for task ':app:compileDebugJavaWithJavac'

jdk环境变量配置

错误的原因是没有安装java SDK.官网选择下载对应的SDK。安装即可。

注意:自定义安装后,自定义路径下面下的是jre,比如,我自定义安装路径为F:\ProgramFiles\java\jre1.8.0_111,java\jre1.8.0_111是默认安装路径的字段,照搬过来。安装成功后,

JDK被放在了C:\Program Files\Java\jdk1.8.0_111目录下面。

安装成功后,需要设置环境变量。[查看原文]

右击“我的电脑”=》"system"=》“advanced system setting”=》“environment variable”

1)在系统变量里新建JAVA_HOME变量,变量值为:C:\Program Files\Java\jdk1.8.0_111(根据自己的安装路径填写)

2)新建classpath变量,变量值为:.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\tools.jar

3)在path变量(已存在不用新建)添加变量值:%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin(注意变量值之间用“;”隔开)

4)“开始”-->“运行”-->输入“javac”-->"Enter",如果能正常打印用法说明配置成功!

补充环境变量:

JAVA_HOME:jdk的安装路径

classpath:java加载类路径,只有类在classpath中java命令才能识别,在路径前加了个"."表示当前路径。

path:系统在任何路径下都可以识别java,javac命令

如何创建一个安卓模拟器

如何启动一个模拟器

参考:android 命令行模式启动模拟器

创建模拟器后,键入android list avd查看可用的虚拟设备



emulator avd 启动模拟器

Execution failed for task ':app:installDebug'.com.android.builder.testing.api.DeviceException:com.android.ddmlib.ShellComma ndUnresponsiveException

参考:React Native疑难点,问题深坑最强总结帖(不断更新中)文中13和16两点

官网:troubleshooting。官网页面就有记录这个错误以及解决方案。·__·

根据官网的提示:该错误的原因是版本级别不对,需要将1.3.1版本降级为 1.2.3

  1. 需要将 android/build.gradle 里的 gradle:1.3.1 改为 gradle:1.2.3
  2. 需要将 android/gradle/wrapper/gradle-wrapper.properties里的 distributionUrl 版本改为gradle-2.2-all.zip

再次报错:Execution failed for task ':app:installDebug'.

com.android.builder.testing.api.DeviceException: java.lang.RuntimeException: No connected devices!

在 react packager中报错,报错的原因是设备没有成功连接

尝试解决方案:

  1. 启动avd manager,添加虚拟设备。

最终解决方案

启动genymotion setting => ADB 选择 "use custom android SDK tools", 复制黏贴sdk安装路径即可。

参考:Android Studio如何集成Genymotion,android studio中成功安装好genymotion插件后,重启android studio。

点击红色按钮,启动虚拟设备

命令行: avd devices 查看当前运行的全部模拟器,正确安装的话,就能看启动的设备

切换到awesome目录,react-native run-android 。成功!note2是通过use链接的真机

附录:

adb操作命令详解及大全

adb是什么?

adb的全称为Android Debug Bridge,就是起到调试桥的作用。通过adb我们可以在Eclipse中方面通过DDMS来调试Android程序,说白了就是debug工具。adb的工作方式比较特殊,采用监听Socket TCP 5554等端口的方式让IDE和Qemu通讯,默认情况下adb会daemon相关的网络端口,所以当我们运行Eclipse时adb进程就会自动运行。

adb有什么用?:借助adb工具,我们可以管理设备或手机模拟器的状态。还可以进行很多手机操作,如安装软件、系统升级、运行shell命令等等。其实简而言说,adb就是连接Android手机与PC端的桥梁,可以让用户在电脑上对手机进行全面的操作

常见:

android list avd 系统中所有模拟器

adb devices 查看当前运行的所有模拟器

adb shell 进入设备的或模拟器的shell 模式

ctrl + d 退出adb shell模式

jdk与jre的区别

JDK就是Java Development Kit.面向开发人员,它提供了Java的开发环境和运行环境。

SDK是Software Development Kit 一般指软件开发包,可以包括函数库、编译程序等。

JRE是Java Runtime Enviroment是指Java的运行环境,是面向Java程序的使用者,而不是开发者。

JVM,java virtual machineJVM或java虚拟机,它是整个java实现跨平台的最核心的部分,所有的java程序会首先被编译为.class的类文件,这种类文件可以在虚拟机上执行,也就是说class并不直接与机器的操作系统相对应,而是经过虚拟机间接与操作系统交互,由虚拟机将程序解释给本地系统执行

史上最全Windows版本搭建安装React Native环境配置

React Native Android 踩坑之旅

待解决问题

  1. android studio 中avd manager为什么不能点击

react-native环境搭建的更多相关文章

  1. Ubuntu17.10 React Native 环境搭建

    React Native 环境搭建 环境:ubuntu17.10 安装依赖 必须安装的依赖有:Node.React Native 命令行工具以及 JDK 和 Andriod Studio. 安装nod ...

  2. 初学 React native | 环境搭建(在模拟器上运行)

    我的电脑是windows 所以就以 windows上+Android 配置React native 环境 网上的安装教程非常多,我总结了一下,配置环境时出错原因主要是node java python ...

  3. React Native环境搭建以及几个基础控件的使用

    之前写了几篇博客,但是没有从最基础的开始写,现在想了想感觉不太合适,所以现在把基础的一些东西给补上,也算是我从零开始学习RN的经验吧! 一.环境搭建 首先声明一下,本人现在用的编辑器是SublimeT ...

  4. Mac系统下React Native环境搭建

    这里记录一下在Mac系统下搭建React Native开发环境的过程: 1. 安装HomeBrew: /usr/bin/ruby -e "$(curl -fsSL https://raw.g ...

  5. 逻辑性最强的React Native环境搭建与调试

    React Native(以下简称RN),已经“火”了好一段时间了,网上的资料相对也很丰富,只是一直迟迟没有发布1.0,不过出身豪门(Facebook)的RN和国内顶级互联网公司对于RN的实践与应用, ...

  6. react Native环境 搭建

    react Native的优点:跨平台 低投入高回报 性能高 支持动态更新.一才两用(ios和Android) 开发成本第 代码复用率高.windows环境搭建react Native开发环境1.安装 ...

  7. React Native 环境搭建踩坑

    React Native (web Android)环境搭建踩坑(真的是一个艰辛的过程,大概所有坑都被我踩了 官方文档地址 : https://facebook.github.io/react-nat ...

  8. React-Native(一):React Native环境搭建

    第一步:安装jdk 从java官网下载jdk8 配置环境变量: JAVA_HOME:D:\Program Files\Java\jdk1.8.0_111 Path中追加:%JAVA_HOME%\bin ...

  9. react native环境搭建(含错误处理)

    1.  Python 2  注意,不要选择3.0及以上的,还不成熟 安装过程中一直 next就可以了,但是注意下图,勾选添加到系统环境变量 安装完之后cmd输入 python 查看是否安装成功. 补充 ...

  10. React Native环境搭建(iOS、Mac)

    http://reactnative.cn/docs/0.42/getting-started.html#content 1.安装Homebrew Homebrew, Mac系统的包管理器,用于安装N ...

随机推荐

  1. scikit-learn包的学习资料

    http://scikit-learn.org/stable/modules/clustering.html#k-means http://my.oschina.net/u/175377/blog/8 ...

  2. Mysql在windows系统下的配置

    因为项目测试需求,不得不在本地装一个Mysql才能更方便地进行程序调试,整个过程虽然简单,但也遇到了一点麻烦,所以贴出来当是备忘. 这里采用MySQL Community Server  5.7.12 ...

  3. map<虽然一直不喜欢map>但突然觉得挺好用的

    #include<iostream> #include<cmath> #include<cstdio> #include<algorithm> #inc ...

  4. Swift的关键字

    在声明中使用关键字 let   :声明一个常量 var :声明一个变量 class :声明一个类 static :静态的 deinit :反初始化方法?析构方法 init :构造方法?初始化方法 en ...

  5. Excel Sheet Column Title

    Given a positive integer, return its corresponding column title as appear in an Excel sheet. For exa ...

  6. 一眼看懂深浅拷贝(clone)-C#

    这是使用的是序列化的方式实现深拷贝 [Serializable] class Person:ICloneable { /// <summary> /// 字符串在clone 中类似于值类型 ...

  7. PHP之几道面试题

    1.二分查找算法 function two_find($arr,$low,$height,$k){ if($low<=$height){ $mid = intval(($low+$height) ...

  8. Excel中添加下拉框

    数据->数据验证->数据验证 设置—>允许下拉框中选择序列,来源中写下拉选项,每个选项之间用逗号隔开

  9. while(cin.eof)出错 poj

    zoj遇到c++如何判定输入流结尾的问题,一不小心就超时了 楼下的代码可以通过zoj #include<iostream> using namespace std; int main(){ ...

  10. 浅谈Js闭包现象

    一.1.我们探究这个问题的时候如果按照正常的思维顺序,需要知道闭包是什么它是什么意思,但是这样做会让我们很困惑,了解这个问题我们需要知道它的来源,就是我们为什么要使用闭包,先不管它是什么意思!     ...