根据RN中文网上的文档搭建环境,有的地方说的不是很清楚,所以小白的我搞了很久,终于搭建成功,这里分享一下

1. java:

  jdk和jre,我下载的是1.8(因为官方文档上说AndroidStudio需要1.8或更高版本),下载地址 http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

  (注意:win10的环境变量格式可能和win7不同,注意一下)

  环境变量: 系统变量-->新建JAVA_HOME,变量值填写jdk的安装目录

       系统变量-->Path 变量-->编辑,添加%JAVA_HOME%\bin 和 %JAVA_HOME%\jre\bin

  都设置好之后可以运行cmd开启命令行,输入java -version测试一下,如果能够成功正确输出java版本号,那就没毛病了啊

2. Android SDK:

我这里下载了一个Android Studio,官方文档说需要2.0以上版本,也没什么好说的,这段就看官方文档吧 http://reactnative.cn/docs/0.28/getting-started.html

安装好以后,要设置环境变量:

a. 系统变量-->新建ANDROID_HOME-->变量值是你安装的Android SDK的路径

b. 系统变量-->Path-->添加两个值 %ANDROID_HOME%\tools 和 %ANDROID_HOME%\platform-tools

3. NodeJS

  https://nodejs.org/en/  在官网下载,选择Recommended For Most Users版本,需要修改安装路径的就改下安装路径,一路下一步- -

  把nodejs路径加进Path环境变量

  装好后可以在命令行里输入node -v来验证安装是否成功

4. Git

  https://git-for-windows.github.io/

  在安装过程中注意勾选"Use Git from the Windows Command Prompt",    "Use Window's default console window"。 需要修改安装路径的就改下安装路径,剩下的一路下一步

5. 安装react native命令行工具react-native-cli

  运行cmd, 输入 npm install -g react-native-cli

6. 安装C++环境

  VS2013或者VS2015,

  VS2013安装完之后运行npm config set msvs_version 2013 --global;VS2015安装完之后运行npm config set msvs_version 2015 --global

  最后运行npm install bcrypt

7. 安装python(2.7.X的版本)

  https://www.python.org/downloads/release/python-2710/

以上安装完,就可以创建一个项目目录了,然后接下来:

1. 进入项目目录,运行 react-native init MyProject,等待几分钟

2. 进入MyProject,运行packager:   react-native start, 可以看到命令窗口最后有段“React packager ready.”,继续往下进行

3. 运行模拟器

  我用的是AndroidStudio的模拟器,本来想用Genymotion,依赖Virtualbox的,他们两个搞了半天没有运行成功,查了一下大概意思是win10不兼容?没有往深探究,回头研究一下如果成功打算换Genymotion,当然也可以连真机(我没连)

4. 保持packager开启(第2步的命令窗口),然后在MyProject下新开一个命令窗口,运行 react-native run-android,等待一会,第一次运行会很慢

5. 然后就可以看到模拟器上程序自己启动了

遇到的几个错误:

1. react-native 不是内部命令什么的

  在npm install -g react-native-cli之后,打开你的nodejs文件夹,进入node_global,发现下面有个react-native.cmd和react-native;如果没有,建议删掉node_global下的node_modules下的react-native-cli,然后重新运行npm install -g react-native-cli。

  解决办法: 把node_global的路径也加进Path环境变量;改完环境变量之后要重新开启cmd命令窗口才有效果

2. react-native run-android时,提示 error: more than one device/emulator

解决方法:打开任务管理器,把所有的adb和emulator的线程都干掉,重新运行 react-native run-android

3. npm install 相关命令时,提示 Error: Can't find Python executable "XX:/Python27", you can set the Python env variable.

此时此刻,我的环境变量确认没问题,在Path变量里加入了Python的路径,没加的同学加一下。为什么还报错

解决方法: 运行 npm config set python D:/Python27/python

  D:/Python27 是我python的安装文件夹, 后面的python代表指定到.exe文件

4. 未能加载C++组件

因为之前没有安装C++环境,所以遇到了这个问题,请参考上面第6条

windows玩RN坑很多,一个接一个,慢慢折腾吧,遇到问题去搜一搜基本都能搜到,加油

ReactNative win10初体验的更多相关文章

  1. 2016款MACBOOK PRO触控条版 安装WIN10初体验 及 无奈退货记

    新的2016MBP终于发布了,作为把苹果电脑装WIN使用的人,等候很久之后,终于可以行动了. 黄山松 (Tom Huang) 发表于博客园http://www.cnblogs.com/tomview/ ...

  2. win10初体验,我的错误代码哪里去了

    今天闲着,就把WIN7升级安装成WIN10,感觉这次WIN10的升级方案确实还可以人,可以保留文件和配置升级. 升级完,试了一下宽带连接,发现错误代码没了,像下面的应该就691呢~~~

  3. Android开发学习之路--React-Native之初体验

      近段时间业余在学node.js,租了个阿里云准备搭建后端,想用node.js,偶尔得知react-native可以在不同平台跑,js在iOS和android上都可以运行ok,今天就简单学习下rea ...

  4. win7升win10,初体验

    跟宿舍哥们聊着聊着,聊到最近发布正式版的win10,听网上各种评论,吐槽,撒花的,想想,倒不如自己升级一下看看,反正不喜欢还可以还原.于是就开始了win10的初体验了,像之前装黑苹果双系统一样的兴奋, ...

  5. .NET平台开源项目速览(15)文档数据库RavenDB-介绍与初体验

    不知不觉,“.NET平台开源项目速览“系列文章已经15篇了,每一篇都非常受欢迎,可能技术水平不高,但足够入门了.虽然工作很忙,但还是会抽空把自己知道的,已经平时遇到的好的开源项目分享出来.今天就给大家 ...

  6. Xamarin+Prism开发详解四:简单Mac OS 虚拟机安装方法与Visual Studio for Mac 初体验

    Mac OS 虚拟机安装方法 最近把自己的电脑升级了一下SSD固态硬盘,总算是有容量安装Mac 虚拟机了!经过心碎的安装探索,尝试了国内外的各种安装方法,最后在youtube上找到了一个好方法. 简单 ...

  7. 文档数据库RavenDB-介绍与初体验

    文档数据库RavenDB-介绍与初体验 阅读目录 1.RavenDB概述与特性 2.RavenDB安装 3.C#开发初体验 4.RavenDB资源 不知不觉,“.NET平台开源项目速览“系列文章已经1 ...

  8. Consul在.Net Core中初体验

    Consul在.Net Core中初体验 简介 在阅读本文前我想您应该对微服务架构有一个基本的或者模糊的了解 Consul是一个服务管理软件,它其实有很多组件,包括服务发现配置共享键值对存储等 本文主 ...

  9. Node.js 网页瘸腿爬虫初体验

    延续上一篇,想把自己博客的文档标题利用Node.js的request全提取出来,于是有了下面的初哥爬虫,水平有限,这只爬虫目前还有点瘸腿,请看官你指正了. // 内置http模块,提供了http服务器 ...

随机推荐

  1. Kali Linux additional tools setup

    The steps are pretty straight forward. The only tool that might cause some confusion is SMBexec. Thi ...

  2. Mysql 声明变量

    Mysql 声明变量 Mysql中声明变量有两种方式 第一种: set @num=1; 或set @num:=1; //这里要使用变量来保存数据,直接使用@num变量 第二种: select @num ...

  3. QT常用资料

    QTableView介绍 Qt 自定义 滚动条 样式 QTableWidget控件总结  QTableWidget的使用和美工总结 QT__stylesheet__操作 QSS QT皮肤(QSS)编程 ...

  4. eclipse android sdk content loader一直显示0%的问题解决

    今天上班启动eclipse,发现eclipse 一直卡在android sdk content loader的地方,一直显示为0%.百度后发现很多都是一下解决方法:  关闭Eclipse,删掉Ecli ...

  5. Qt and C++ Reflection,利用Qt简化C++的反射实现

    如何在C++中实现反射机制,应该算是C++开发中经常遇到的问题之一.C++程序没有完整的元数据,也就无法实现原生的反射机制.从性能的角度讲,这样的设计不难理解,毕竟在运行时储存这些元数据需要额外的开销 ...

  6. js判断浏览器,包括Edge浏览器

    /* * 描述:判断浏览器信息 * 编写:LittleQiang_w * 日期:2016.1.5 * 版本:V1.1 */ //判断当前浏览类型 function BrowserType() { va ...

  7. 自动运维:Ansible -ansible tower

    文档主页:http://docs.ansible.com/参考文档:http://docs.ansible.com/ansible/参考文档:http://docs.ansible.com/ansib ...

  8. JMeter基础之一 一个简单的性能测试

    JMeter基础之一 一个简单的性能测试 上一节中,我们了解了jmeter的一此主要元件,那么这些元件如何使用到性能测试中呢.这一节创建一个简单的测试计划来使用这些元件.该计划对应的测试需求. 1)测 ...

  9. C#:调用webservice时提示对操作的回复消息正文进行反序列化时出错

    主要原因webservice返回值的长度超过readerQuotas中的了maxStringContentLength值,造成返回值截断,不完整,反序列化时出错. <readerQuotas m ...

  10. 黄聪:C#中HtmlAgilityPack判断是否包含或不包含指定的属性或值

    //选择不包含class属性的节点 var result = node.SelectNodes(".//span[not(@class)]"); //选择不包含class和id属性 ...