文档章节

React Native Android Windows环境搭建

Drex
 Drex
发布于 2016/03/02 11:36
字数 628
阅读 43
收藏 0

基础知识

React Native 中文文档:http://reactnative.cn/

严格按照官方的文档进行配置:http://reactnative.cn/docs/0.20/android-setup.html#content

注意:Android SDK有一个组件m2repository可能会没有,下载地址http://pan.baidu.com/s/1bovaqeV 下载之后解压到Android安装路径下 Android\android-sdk\extras\android 此目录

创建项目

进入你的工作目录,运行

react-native init MyProject

并耐心等待数(或数十)分钟。

0.14版本中带来了一个新的问题以至于在windows下引用图片不能成功(在0.15后修复),请参考这里进行对应修改以绕过此BUG。

运行packager

react-native start

可以用浏览器访问http://localhost:8081/index.android.bundle?platform=android看看是否可以看到打包后的脚本。第一次访问通常需要十几秒,并且在packager的命令行可以看到进度条。

安卓运行

保持packager开启,另外打开一个命令行窗口,然后在工程目录下运行

react-native run-android

首次运行需要等待数分钟并从网上下载gradle依赖。

运行完毕后可以在模拟器或真机上看到应用自动启动了。

如果gradle依赖下载出现报错,请多试几次,或者设置VPN加速。

如果apk安装运行出现报错,请检查上文中安装SDK的环节里所有依赖是否都已装全,platform-tools是否已经设到了PATH环境变量中,运行adb devices能否看到设备。

至此,应该能看到APP运行,并报错 Unable to download JS bundle

摇晃设备或按Menu键(Bluestacks模拟器按键盘上的菜单键,通常在右Ctrl的左边 或者左Windows键旁边),可以打开调试菜单,点击Dev Settings,选Debug server host for device,输入你的正在运行packager的那台电脑的局域网IP加:8081(同时要保证手机和电脑在同一网段,且没有防火墙阻拦),再按back键返回,再按Menu键,在调试菜单中选择Reload JS,就应该可以看到运行的结果了。

如果真实设备白屏但没有弹出任何报错,可以在安全中心里看看是不是应用的“悬浮窗”的权限被禁止了。

安卓调试

打开Chrome,访问 http://localhost:8081/debugger-ui,应当能看到一个页面。按F12打开开发者菜单。

在模拟器或真机菜单中选择Debug JS,即可开始调试。

© 著作权归作者所有

共有 人打赏支持
Drex
粉丝 0
博文 4
码字总数 847
作品 0
北京
前端工程师
React Native基础——环境配置、学习资源分享

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/m366917/article/details/53957903 React Native基础——环境配置、学习资源分享 已经有两个月没有写过博客,...

Aduroidpc
2016/12/31
0
0
linux平台安装React Native遇到的坑

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u011068702/article/details/82631458 3年前我在windows平台安装过React Native,我一直都记忆犹新,那个时候f...

chenyu_insist
09/11
0
0
React Native SDK for OSS

此文主要介绍 React Native SDK for OSS的方方面面,包括相关基本概念、项目背景、项目方案、环境搭建运行、使用姿势、注意事项等。文末的附件可运行Example Zip压缩包和针对新手的入门实用文...

zuozhao
05/18
0
0
React Native 环境搭建踩坑

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

大瑶的踩坑之旅
08/02
0
0
一步一步在Windows下搭建React Native Android开发环境

执行上句命令后打开下面这个连接 http://localhost:8081/index.android.bundle?platform=android 页面如图上: 这个页面的说明android项目没有编译成功 需要删除项目(MyProject)下的这个路径...

陈映亮
2017/10/19
0
0

没有更多内容

加载失败,请刷新页面

加载更多

IE浏览器http请求,中文传参报400错误-解决方法

做项目的时候,遇到一个小的问题.一个get请求列表数据的接口,在其它浏览器上是可以正常请求的.但是在ie浏览器上确出现奇怪的http请求400错误,其含义是你访问的页面域名不存在或者请求错误,自...

青衫旧巷
35分钟前
1
0
Spring中@RequestParam与@PathVariable的区别

@RequestParam与@PathVariable为spring的注解,都可以用于在Controller层接收前端传递的数据,不过两者的应用场景不同。 @PathVariable主要用于接收http://host:port/path/{参数值}数据。@Re...

王子城
39分钟前
0
0
数据运营者的福音:海量数据处理利器Greenplum

作者:李树桓 个推数据研发工程师 前言:近年来,互联网的快速发展积累了海量大数据,而在这些大数据的处理上,不同技术栈所具备的性能也有所不同,如何快速有效地处理这些庞大的数据仓,成为...

个推
39分钟前
1
0
进程和线程的区别介绍

1、首先是定义 进程:是执行中一段程序,即一旦程序被载入到内存中并准备执行,它就是一个进程。进程是表示资源分配的的基本概念,又是调度运行的基本单位,是系统中的并发执行的单位。 线程...

linuxprobe16
40分钟前
1
0
IntelliJ IDEA 工具的学习与使用

当前标签: IntelliJ IDEA IntelliJ IDEA(十一) :Debug的使用 JaJian 2018-08-04 02:32 阅读:402 评论:0 IntelliJ IDEA(十) :常用操作 JaJian 2018-05-22 18:43 阅读:1272 评论:0 Inte......

glen_xu
48分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部