一步一步在Windows下搭建React Native Android开发环境

搭建JAVA开发环境

根据操做系统分为x86或x64位的，下载jdk1.8以上的版本，

本机安装时的Java版本：jdk-8u45-windows-x64.exe

配置JAVA的环境变量

[html] view plain copy

 print?

1. JAVA_HOME = C:\Program Files\Java\jdk1.8.0_45  
2. CLASSPATH = .;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;  
3. path 增长;%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;  

 

安装Android Studio

本机安装时的Android Studio版本：androidstudio1.5.0.0.1454148047.exe

 

增长Android SDK的环境变量配置

 

[html] view plain copy

 print?

1. ANDROID_HOME = D:\Android\sdk  
2. path 增长 ;%ANDROID_HOME%;%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools;  

 

 

安装NodeJS开发环境

 

安装流程参考：http://blog.csdn.net/itpinpai/article/details/48103845

 

安装Git版本控制

本机安装时的Git版本：Git-1.9.5-preview.exe

安装流程参考：http://blog.csdn.net/itpinpai/article/details/48105445

 

安装虚拟机

 

本机安装时的虚拟机版本：genymotion-2.6.0-vbox

 

这个软件须要在官网上注册一个帐号，先注册才能下载，官网地址：www.genymotion.com/

 

安装React-native-cli

 

[python] view plain copy

 print?

1. npm install -g react-native-cli  

初始化项目

 

[python] view plain copy

 print?

1. react-native init reactNative  

启动项目
 

[python] view plain copy

 print?

1. react-native start  

 

执行上句命令后打开下面这个链接

http://localhost:8081/index.android.bundle?platform=android

页面如图上：

这个页面的说明android项目没有编译成功

须要删除项目(MyProject)下的这个路径下的文件：MyProject\node_modules\react-native\node_modules\react-transform-hmr\node_modules\react-proxy\node_modules\react-deep-force-update\.babelrc

以下图：

 

关闭cmd窗口，再次打开运行react-native start 回车

打开刚才输入的链接地址页面显示以下截图

 

执行react-native start 可能会报以下图错：

 

解决办法：
修改这个文件F:\reactNative\MyReact\node_modules\react-native\packager\react-packager\src\DependencyResolver\FileWatcher\index.js

把原来的
const MAX_WAIT_TIME = 120000;
修改成

const MAX_WAIT_TIME = 120000000;

 

 

运行 android app

 

[ruby] view plain copy

 print?

1. react-native run-android  

 

运行可能须要一些时间。要耐心等待

 

 

安卓调试

目前Windows下没法自动打开chrome进行调试，因此手动打开chrome，访问以下地址： http://localhost:8081/debugger-ui 便可。