react native window下的环境搭建和调试方案
这几天使用react native开发app,遇到一些坑,先记录下来,以后再继续补充
环境搭建
打开react native中文网,发现环境搭建特么也太复杂了,安装各种插件/软件,对于我们 编辑器+浏览器 就能搞事情 的前端开发人员来说,确实有些蛋疼,特别是有些包还需要科学上网,甚至科学上网也下不下的时候。

那么,可不可以不按照它指定的搭建方式去搭建,经过尝试,完全可以不用安装那么多东西。下面开始我的简单版环境搭建
安装java jdk / android sdk / 配置环境变量 / 链接手机运行。
详细说明:
1/ 首先需要有node ,然后通过 npm install react-native-cli -g 全局安装 react-native
找个文件夹 初始化一个项目 react-native init AwesomeProject
2/ 安装java jdk,并配置环境变量 (参考这个帖子)
3/ 安装android sdk
由于科学上网的关系,国内好多安装方法都无法访问google,这里给大家提供一个简单的android sdk包
链接:http://pan.baidu.com/s/1hrWgZwK 密码:6m70
下载解压后,配置环境变量(参考这个帖子)
在压缩包中双击sdk manager.exe,当然点一下可能不行,就多点几下,弹出窗口中选择最新的sdk tools platform-tools build-tools 点击install(由于网络问题,需要多试几次)

4/ 然后链接手机,手机打开开发中调试,在电脑的项目文件夹打开命令行,运行 react-native run-android,就可以慢慢打包了,耐心等待,开始的时候下载gradle会特别慢,不要紧,耐心等待,或者去这里下载,https://services.gradle.org/distributions/ ,

运行到这里,在手机上就装好了。

注:如果到此步没有打包成功,提示缺乏licenses,则可以创建要给xxx.bat文件,贴入如下代码,然后点击运行以下,应该就可以了。
mkdir "%ANDROID_HOME%\licenses"
echo |set /p="8933bad161af4178b1185d1a37fbf41ea5269c55" > "%ANDROID_HOME%\licenses\android-sdk-license"
以后就真机调试就好啦,在menu菜单中选择 debug js remotely,就会自动在chrome浏览器打开控制台调试,很方便
菜单如下

一般在打开app的情况下摇一摇就出menu ,如果没有的话,就在电脑命令行输入
,就会在手机端弹出菜单。
补充:在菜单中可以选上 live roload 和hot reloading ,这样当修改完成代码,就可以自动热更新了。(有时热更新不管用,就需要reload或者直接重新打包安装)
热更新需要配置 端口,在dev settings中选择debug server ,在弹窗中输入 电脑ip地址:8081,就Ok了。



完!
react native window下的环境搭建和调试方案的更多相关文章
- 【转】android 最新 NDK r8 在window下开发环境搭建 安装配置与使用 详细图文讲解,完整实际配置过程记录(原创)
原文网址:http://www.cnblogs.com/zdz8207/archive/2012/11/27/android-ndk-install.html android 最新 NDK r8 在w ...
- android 最新 NDK r8 在window下开发环境搭建 安装配置与使用 详细图文讲解,完整实际配置过程记录(原创)
android 最新 NDK r8 在window下开发环境搭建 安装配置与使用 详细图文讲解,完整实际配置过程记录(原创) 一直想搞NDK开发却一直给其他事情耽搁了,参考了些网上的资料今天终于把 ...
- Android NDK r8 Cygwin CDT 在window下开发环境搭建 安装配置与使用 具体图文解说
版权声明:本博客全部文章均为原创.欢迎交流.欢迎转载:转载请勿篡改内容,而且注明出处,谢谢! https://blog.csdn.net/waldmer/article/details/3272500 ...
- React Native在window下的环境搭建(二):创建新项目
React Native创建一个新项目: react-native init TestAndroidApp 提示:你可以使用--version参数(注意是两个杠)创建指定版本的项目.例如react-n ...
- React Native在window下的环境搭建(一)
React Native官方开发文档 以下是本人抄录的: 初次接触React Native感觉和React很像,却是有点类似,但不完全是,React Native有自己的组件对象,不过它也自定义的组件 ...
- window下lamp环境搭建
软件: apache_2.2.25.msi php-5.4.30-Win32-VC9-x86.zip mysql-5.6.11-win32.msi下载地址:http://download.csdn.n ...
- React Native从零到一搭建开发环境
React Native从零到一搭建开发环境 ReactNative环境搭建 安装Homebrew 安装rvm 安装nvm 安装node 安装react-native-cli 安装watchman i ...
- React Native 简介:用 JavaScript 搭建 iOS 应用(2)
[编者按]本篇文章的作者是 Joyce Echessa--渥合数位服务创办人,毕业于台湾大学,近年来专注于协助客户进行 App 软体以及网站开发.本篇文章中,作者介绍通过 React Native 框 ...
- React Native 简介:用 JavaScript 搭建 iOS 应用 (1)
[编者按]本篇文章的作者是 Joyce Echessa--渥合数位服务创办人,毕业于台湾大学,近年来专注于协助客户进行 App 软体以及网站开发.本篇文章中,作者介绍通过 React Native 框 ...
随机推荐
- Mahout学习之Mahout简单介绍、安装、配置、入门程序測试
一.Mahout简单介绍 查了Mahout的中文意思--驭象的人,再看看Mahout的logo,好吧,想和小黄象happy地玩耍,得顺便陪陪这位驭象人耍耍了... 附logo: (就是他,骑在象头上的 ...
- Mysql5.7全新的root密码规则
http://blog.csdn.net/erlib/article/details/48003681
- QMsgPack简介
QMsgPack简介 首先,关于MessagePack协议,访问http://msgpack.org可以了解详细的格式约定及各种语言的实现. MessagePack协议号称比JSON快,但速度的快慢这 ...
- wget 下载文件重进行命名
wget在下载的时候就重命名的: wget -c "www.baidu.com" -O baidu.index.html 保存输出日至,可以使用: wget -c "ww ...
- windows如何查看删除记录
方法 打开组策略中的计算机配置-Windows设置-安全设置-本地策略-审核策略的审核对对像防问, 双击出现的对话框中钩选成功和失败,经过上面的设置,现在就可以设置文件和文件夹的审核了.(注须在NTF ...
- FFMPEG类库打开流媒体的方法(传参数)
使用ffmpeg类库进行开发的时候,打开流媒体(或本地文件)的函数是avformat_open_input(). 其中打开网络流的话,前面要加上函数avformat_network_init(). 一 ...
- matlab strel
>>se3 = strel('square',3)Neighborhood: 1 1 1 1 1 1 1 1 1 >> se3 = strel('line',3 , 45)Ne ...
- easyui radio 取值和赋值
1.html文件 <td><input id="client" type="text" name="client" sty ...
- [Linux] du-查看文件夹大小-并按大小进行排序
reference : http://blog.csdn.net/jiaobuchong/article/details/50272761# 某天,我想检查一下电脑硬盘的的使用情况,作为一个命令控,废 ...
- go语言基础之字符串类型 和 字符与字符串类型的区别
1.字符串类型 示例1: package main //必须有一个main包 import "fmt" func main() { var str1 string str1 = & ...