一.React-Native学习之Window环境下搭建环境配置

一.安装JDK

      1.从Java官网下载JDK并安装。 也可以从百度云下载x64版本

      2.安装成功可以用java -version查看版本信息

      3. 配置环境变量
  JAVA_HOME=C:\Program Files\Java\jdk1.8.0_45
  Path+=%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;
  CLASSPATH+=%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;

     JAVA_HOME变量

  

  Path变量

  

  CLASSPATH变量

  

 

二.安装Android SDK

     推进安装Android Studio

     1.官网链接AndroidDevTools百度云

     2.安装完成后在SDK Platforms窗口中,选择Show Package Details,然后在Android 6.0 (Marshmallow)中勾选Google APIsIntel x86 Atom System ImageIntel x86 Atom_64 System Image以及Google APIs Intel x86 Atom_64 System Image

  

     3.SDK Tools窗口中,选择Show Package Details,然后在Android SDK Build Tools中勾选Android SDK Build-Tools 23.0.1。(必须是这个版本)

     .

     4.配置ANDROID_HOME环境变量

      ANDROID_HOME= C:\Users\Administrator\AppData\Local\Android\sdk

     

三.安装NodeJS

      1.从官网下载node.js的官方4.1版本或更高版本。百度云

      2.可使用node -v的命令来测试NodeJS是否安装成功

四、安装git

      1.官网 或百度云下载git安装包

      2.配置环境变量

   GIT_HOME=C:\Program Files\Git

     

 

 五.安装Python

     官网下载并安装python 2.7.x(3.x版本不行) 百度云

 

 六.安装react-native

  1.安装react-native命令行工具react-native-cli,git配置完成后可以clone React-native-cli了

    1)   在命令行中进入你希望RN安装的目录

    2)   输入git clone https://github.com/facebook/react-native.git

    

    3)   进入刚刚目录下的react-native目录下的react-native-cli目录,输入npm install -g

 

       

    安装好之后,可以命令行下就有react-native命令了

     2.创建React-Native项目

        进入你希望创建项目的目录后,输入react-native init AwesomeProject,等待一段时间(较慢)
                 

       

 

         目录结构:

    

       3.运行package

          1) 在命令行中进入项目目录,输入react-native start,等待一段时间:

      

       然后在浏览器中输入http://localhost:8081/index.android.bundle?platform=android,如果可以访问就表示服务端启动了

    

 

      4.运行项目

         刚刚运行package的命令行不要关闭,重新启动一个新的命令行 ,进入项目目录,输入react-native run-android

     

     接下来可能会出错

   

 

    解决方案:

   1)更改gradle为1.2.3

     

        2)在安卓机中--关于手机---长按MIUI版本 ,在弹出层中开启开发中模式

    

      3)在开发中选项中开启usb调试  并禁用"启用MIUI优化",重启手机。

    

      接下来打开安装好的app,会白屏,这是需要找到并打开悬浮窗权限。

        教程http://jingyan.baidu.com/article/f25ef25466c0fc482d1b824d.html

      然后重新打开app,报错

  

     这时候摇一摇手机,点击Dev Settings后,点击Debug server host & port for device,设置IP和端口

     

      再次摇一摇手机,选择Reload ,程序就运行起来,出现Welcome to React Native!

  

     至此,就可以尽情的安卓code了!

 

posted @ 2016-07-09 11:46  李紫能  阅读(6466)  评论(1)    收藏  举报