在window的环境下搭建react-native的Android开发环境（转）

关于os x环境搭建以及react native入门学习资料请移步:http://www.lcode.org/react-native/

刚创建的React Native技术交流群(282693535),欢迎各位大牛,React Native技术爱好者加入交流!同时博客右侧欢迎微信扫描关注订阅号,移动技术干货,精彩文章技术推送!

1、安装Java

这里需要注意对环境变量的设置，可以根据java -version来检测一下

2、安装SDK

这里需要注意设置环境变量ANDROID_HOME：Android SDK Manager的位置 例如：（ANDROID_HOME=> E:\Android\sdk）设置环境变量PATH：例如：（PATH=> %ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools）

可以单独安装Android SDK，也可以通过Eclipse ADT或者Android Studio一并安装。推荐使用Android Studio，以下说明会默认以Android Studio的方式说明。请注意选择x86还是x64版本。

为了加速下载，推荐从AndroidDevTools下载。

然后进入SDKManager(可通过Android Studio菜单Tools-Android-SDK Manager)，确保以下项目已经安装并更新到最新：

  • Tools/Android SDK Tools (24.3.3)
  • Tools/Android SDK Platform-tools (22)
  • Tools/Android SDK Build-tools (23.0.1)
  • Android 6.0 (API 23)/SDK Platform (1)
  • Extras/Android Support Library(23.0.1)

推荐使用腾讯Bugly的镜像加速下载。查看说明

推荐将SDK的platform-tools子目录加入系统PATH环境变量。

3、设置SDK

  • 打开Android SDK Manager。
  • 选中以下项目：
  • Android SDK Build-tools version 23.0.1
  • Android 6.0 (API 23)
  • Android Support Repository

4、安装node

这货是基于js的，node.js轻量级的Web服务器，想要是React Native跑起来需要安装node， 如果没有安装node.js，先去官网安装node.js,最好是4.1以上版本

下载地址：https://nodejs.org/en/

下载node.js，找好对应的版本，然后去安装就可以了。
大家可以通过node -v的命令来测试NodeJS是否安装成功

5、安装git

安装React-native需要用到git，如果没有配置git，需要先下载对应的客户端，然后将git加入path环境变量即可
下载地址：https://git-for-windows.github.io/
安装：

6、安装react-native命令行工具React-native-cli

git配置完成后可以clone React-native-cli了，建议大家到将React-native-cli克隆到某个盘，不要在c盘直接clone

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

2)   输入git clone https://github.com/facebook/react-native.git，等待下载

clone成功后：

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

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

7、创建RN项目

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

成功后：

目录结构：

7、运行package

在命令行中进入项目目录，输入react-native start，等待一段时间：

这时候可以用浏览器访问http://localhost:8081/index.android.bundle?platform=android，如果可以访问表示服务器端已经可以了。

7、运行项目

刚刚运行package的命令行不要关闭，重新启动一个新的命令行，

进入项目目录，输入react-native run-android

等待运行(如果是第一次运行，首先会下载gradle，时间较长)

运行成功后出现下图

第一次手机肯定报错

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

         

这里的IP是电脑的IP，不知道的可以在命令行中输入ipconfig进行查询，端口号固定8081

设置完成后，回到空白页面，再次摇一摇手机，选择Reload JS，程序就运行起来，出现Welcome to React Native！

        

时间： 2024-10-12 00:19:01

在window的环境下搭建react-native的Android开发环境（转）的相关文章

windows环境下搭建react native环境

一.基础软件1.安装jdk-1.8.0_922.安装android studio-2.1.2(文件大小为1.2G的那个)3.安装node.js(目前最新是6.3.0)4.安装git-2.9.05.安装genymotion-2.7.2(进入setting配置sdk为android studio的sdk)注意1:genymotion模拟器开启后要打开wifi,react native需要注意2:设置环境变量ANDROID_HOME值:C:\Users\clock\AppData\Local\Andr

LInux环境下Eclipse + Tomcat + MySQL 配置J2EE开发环境的方法

上一篇博文里总结了面向对象三大特性在Java中的体现,现在谈一谈Java中的抽象类,接口,内部类等特性. 一. 抽象类 public abstract class Shape { public int shapeID = 0; public abstract double getArea(); } Java中允许类.接口或成员方法具有抽象属性,而不允许成员域或构造方法具有抽象属性. 类修饰词中含有abstract的类具有抽象属性,称为抽象类:接口总是具有抽象属性. 如果成员方法的修饰词中含有ab

手把手教你在Windows下搭建React Native Android开发环境

最近看到React Native好像好厉害的样子,好奇心驱使之下体验了一下并将在Window下搭建React Natvie Android环境的步骤记录下来,并有需要的朋友参考.(我都是参考官方文档的) react-native的GitHub地址:https://github.com/facebook/react-native react-native的文档地址:http://facebook.github.io/react-native/docs/getting-started.html 1.

Android开发环境搭建日记和嵌入式Android开发环境初探

原文出处:www.cnblogs.com/chsry 非常感谢博客园的各位,按照你们的博文,还有利用百度和谷歌逐渐建立了android的开发环境,只是给自己备份参考查看,看过的人可以忽略这篇文章. 本文章大部分参考了:http://www.cnblogs.com/zoupeiyang/p/4034517.html  ,添加了我搭建时候遇到的问题和自己的解决方案,也基本备份了我当时自己的设置,以备日后查看. 本教程将分为五个步骤来完成Android开发环境的部署. 第一步:安装JDK. 第二步:配

【转】Android开发学习总结(一)——搭建最新版本的Android开发环境

最近由于工作中要负责开发一款Android的App,之前都是做JavaWeb的开发,Android开发虽然有所了解,但是一直没有搭建开发环境去学习,Android的更新速度比较快了,Android1.0是2008年发布的,截止到目前为止Android已经更新Android5.0.1,学习Android开发的第一步就是搭建Android的开发环境,博客园里面有不少人也写了关于如何搭建Android开发环境的文章,我也看了一下,但是感觉都比较旧了,对照着做不一定能够搭建成功,但是有些搭建步骤是还是可

Android开发学习总结(一)——搭建最新版本的Android开发环境【转】

最近由于工作中要负责开发一款Android的App,之前都是做JavaWeb的开发,Android开发虽然有所了解,但是一直没有搭建开发环境去学习,Android的更新速度比较快了,Android1.0是2008年发布的,截止到目前为止Android已经更新Android5.0.1,学习Android开发的第一步就是搭建Android的开发环境,博客园里面有不少人也写了关于如何搭建Android开发环境的文章,我也看了一下,但是感觉都比较旧了,对照着做不一定能够搭建成功,但是有些搭建步骤是还是可

【转】在Windows下搭建React Native Android开发环境

http://my.oschina.net/jackzlz/blog/508210 安装JDK 从Java官网下载JDK并安装.请注意选择x86还是x64版本. 推荐将JDK的bin目录加入系统PATH环境变量. 安装Android SDK 可以单独安装Android SDK,也可以通过Eclipse ADT或者Android Studio一并安装.推荐使用Android Studio,以下说明会默认以Android Studio的方式说明.请注意选择x86还是x64版本. 为了加速下载,推荐从

Mac下搭建react native开发环境

安装必需软件 Homebrew Homebrew, Mac系统的包管理器,用于安装NodeJS和一些其他必需的工具软件. /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" homebrew在安装软件时可能会碰到/usr/local目录不可写的权限问题.可以使用下面的命令修复: sudo chown -R `whoami` /usr/loca

React Native学习笔记 -- 开发环境搭建

工欲善其事,必先利其器.这次主要介绍mac osx下React Native的开发环境的搭建. homebrew mac上的包管理工具,用于安装nodejs和其他一些工具软件,在terminal输入下面命令进行安装: /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 如果在安装过程中遇到提示ACCES: permission denied(

Windows下Node.js环境的搭建并结合WebStorm IDE开发环境

一.环境搭建 1.下载并安装Node.js,在Windows下的安装步骤比较简单,一直下一步就可以了.安装完成后它会在环境变量Path中配置好Node的目录.所以我们可以直接在命令行中使用Node的命令,如:node和npm,可以测试一下是否安装完成,打开命令行,输入node如何出现可以进入就表示安装完成了. 2.下载安装WebStorm现在的版本是7.0.2安装步骤也比较简单这里就不赘述了. 3.WebStorm中配置Node.js环境,在打开WebStorm后点击下图中画红框的图标进行配置.