React Native真机调试安卓版 一.准备工作 1.1 环境搭建 React Native中文网的文档已经非常清晰地描述了,按照步骤即可.http://reactnative.cn/docs/0.43/getting-started.html#content. 1.2 安装React Developer Tool 在chrome中安装插件React Developer Tool. 1.3 新建项目 打开doc命令,初始化一个项目. 二.开始调试 用数据线连接电脑和手机,然后运行命令reac

react-native debug js remotely跨域问题 我们在安卓真机上调试react-native时,启用debug js remotely的时候,会出现跨域问题.这个时候我们只需要一下操作即可 一:右击谷歌浏览器的启动图标,选择属性然后在目标里的最后加入一下代码(前面有空格) --disable-web-security --user-data-dir 二:谷歌浏览器不要锁定在底部任务栏

前文中我们学习过,用 Fiddler 作为代理可以在移动端打开本地的页面进行查看(如何用 fiddler 代理调试本地手机页面),但是对于 js 的调试却无能为力(需要借助其他调试手段,比如 UC浏览器开发者版),只能通过 alert 输出一些东西. alert 的手段在一些简单的调试中还是蛮有效的,但是 alert 会将 js 线程挂起,而且会自动调用输出对象的 toString() 方法,这样有些对象的 alert 就会是 "[object Object]" 的字样.我们想如果能用

记得昨天报了一个错,debug.js文件中的length未定义.前台不定位代码,后天也不报错,而debug.js是框架封装的文件,不是自己写的,无从得知是哪里的问题,而项目也已经重新启动过,无法撤销.所以报错不出现自己代码,也无法撤回,不知何时出现的操作. 后来我degugger.看从哪里开始报错,通过页面加载,确定哪个模块,最终发现,页面还没进来就开始报错,?页面没进来就报错,那就不是代码错误. 配置文件也没改啊,,最后我的目光聚焦到了index.jsp中的title下面的    <mx:Fr

  备注:本人为h5开发人员,不懂安卓和ios,这是开发小伙伴对接联调的主代码. 1.iOS端调用h5界面js方法:     2.安卓端调用h5界面js方法: @Override    protected void initData() {        mTxtBarTitle.setText(getString(R.string.bigdata));        TitleUtils.setToolBarRightIco(getContext(), R.mipmap.ic_unreadms

在做移动端开发的时候大家应该都遇到过这么一个问题:如何在手机上打印调试信息? 在pc端我们通常会用console.log 或者 alert,但大家知道console.log在手机上是看不到打印信息的:而用alert话,alert后还要点击确定,如果循环alert,那就悲剧了,一直点确定吧,可能手机还因此搞死机了. 那么有没有一种显得更加优雅的方式去输出调试信息呢? 有的.使用debug.js就好了. 快速上手 引入debug.js后,你会得到debug这个方法,是用方法如下: debug.suc

最近在学习js,由于没法随身携带笔记本电脑,在手机翻阅<JavaScript高级程序设计>时,时常想调试一下书中的代码.于是就有了,能否在手机上配置一个js开发环境.考虑到手机上的Chrome浏览器没有控制台,无法调试js,那么那么能否在手机上配置一个node环境呢?如果可以,岂不是随时随地都可以调试js代码了? 而且Android 安卓本身就是基于 Linux 系统开发的,Node 也有针对 Linux 的版本,所以理论上完全可行. 经过一番 Google.Baidu 之后,终于实现了以上设

一.JAVA环境 下载 JDK 8.0 添加 %JAVA_HOME% 变量 添加 PATH:%JAVA_HOME%\bin 二.Android环境 下载 Android SDK 修复 SDK Manager.exe 闪退的问题 用 SDK Manager.exe 安装 Android SDK platform-tools(adb) 将 adb 加入到 PATH 三.ReactNative 环境 下载 react-native-cli 初始化脚手架: 运行 $ react-native run-a

一个高效率的开发,不仅仅需要扎实的专业,掌握熟练的调试技巧也是必备技能,熟练的调试技能可以加快开发速度和提升代码质量,降低bug量,可以起到事半功倍的效果:今天来说下react-native在开发过程中的调试技巧. ios平台中的调试 在安装了xcode的基础上,在项目根目录下运行react-native start即可启动本地服务,然后运行react-native run-ios就会自动启动ios虚拟机,自动安装app: 在第一次运行了react-native run-ios之后,后面再次启动

第一次在segmentfault写博客,很紧张~~~公司项目上ReactNative,之前也是没有接触过,所以也是一边学习一边做项目了,最近腾出手来更新总结了一下RN的Debug的一个小知识点,不是说怎么去Debug,而是Debug的代码原理,下面开始正文. Debug过程涉及到三个对象,一个是App(Android或iOS),一个是Server,另外一个就是浏览器(Chrome或FireFox或其他).Server是App和浏览器之间通信的桥梁,比如App发Http请求给Server,Serv

上周末开始接触react native,版本为0.37,边学边看写了个demo,语法使用es6/7和jsx.准备分享一下这个过程.之前没有native开发和react的使用经验,不对之处烦请指出.希望对在web开发有一定基础,想涉及app开发的同学有帮助,共同进步. 一.环境安装 首先是开发环境安装,我是在win7/8 64位环境下安装的安卓环境.模拟器用的是android studio自带模拟器(android emulator),安卓API 24(7.0),因为我没有mac -.-.文中组件

上周末开始接触react native,版本为0.37,边学边看写了个demo,语法使用es6/7和jsx.准备分享一下这个过程.之前没有native开发和react的使用经验,不对之处烦请指出.笔者认为从Vue过度到React应该是非常容易的,毕竟都是面向组件的,一通百通,只是每个框架的特性可能有所不同.本文的目的在于希望对在web开发有一定基础,又想涉及app开发的同学有帮助,共同进步. 一.环境安装 首先是开发环境安装,我是在win7/8 64位环境下安装的安卓环境.模拟器用的是andro

React Native(以下简称RN)为传统前端开发者打开了一扇新的大门.其中,使用浏览器的调试工具去Debug移动端的代码,无疑是最吸引开发人员的特性之一. 试想一下,当你在手机屏幕按下一个按钮,处理事件的代码就可以立即在浏览器的调试工具里进行断点调试,而且每当你对代码进行修改,界面便可以完成快速地重载,省去昂长的编译时间,这会是多么提高工作效率. 传统的Web前端开发人员自然很熟悉浏览器的调试工具,但是对于如何将其在RN中使用以便和移动端结合起来,也许会相当陌生.这也成为了一些开发者跨入R

模拟机调试首先要确认你的环境变量的path中是不是有adb的路径,adb一般在android的adk目录下的platform-tools下,android目录默认是在c盘user/administrator(用户默认的话)/appdata/中 如果使用的是android studio自带的那个模拟器的话,可以这么玩 运行 C:\Users\Administrator\AppData\Local\Android\Sdk\emulator\emulator.exe -netdelay none -n

代码地址如下:http://www.demodashi.com/demo/13486.html 项目预览 IOS: Android: 扫描体验: 或者点我 整体功能跟之前小程序和 Android 项目的大差不差,主要包括四大模块:新闻.段子.历史上的今天和小爱同学(图灵机器人).后面会对每个模块进行大致的介绍. 新闻模块 功能: 查看多种类型的实时新闻,其中包括:头条.社会.国内.国际.娱乐.体育.军事.科技.财经和时尚.并支持点击单个新闻查看新闻详情. 段子模块 功能:查看最新的段子数据,支持

参照官方配置:https://facebook.github.io/react-native/docs/getting-started.html 因为在配置的过程中遇到很多问题,在此记录一下. 1.java的jdk 下载(http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html) 配置jdk的环境变量 a.打开我的电脑--属性--高级--环境变量 新建系统变量JAVA_HOME 和CLA

安装 React Native Tools 在插件市场搜索 react 找到 React Native Tools 进行安装: 创建的react-native的工程拖入vscode中 点击F5即可运行react-native 此时可能出现 如下界面,这是因为没有配置运行文件 在debug 页面,点击如下位置,添加configurations 然后点击添加配置,选择debug android 此时点击F5,则可出现如下界面,表示 react-native以运行起来 此时发现断点无法生效,且log的

首先保证真机和pc 保证在同一个网络下 根据红色错误判断自己是什么情况 例如 提示无法连接远程服务,说明你的不在同一网络下 提示500 可能配置的ip不对 设置ip方法 摇晃手机 ---> Dev Settings ---> debug server host & port for device 然后输入你的ip 和端口号 例如: 192.168.1.18:8081 对于iOS真机来说,需要打开 [`RCTWebSocketExecutor.m`](https://github.com

背景 一款轻阅读应用ReadIT,支持功能:优质文章推送.评论点赞.计划制定.计划闹钟.天气预报.收藏文章.深浅两套主题.多语言切换.极光推送等功能.后续还会继续集成功能.前后端均自主研发,借鉴市面较好的种子工程,目前未上应用市场,文章目前也比较少,后续会持续补充优质文章. 展示效果 点我 下载体验(目前只有安卓版) Github https://github.com/xiaobinwu/readIt 技能树 1.客户端(react-native.@react-navigation.react-

本文基于React Native 0.52 一.创建一个项目 1.初始化一个RN项目 react-native init RNDemo 2.连接一个设备或是打开模拟器 可以通过 adb devices 查看连接的设备,如下图: 3.进入RNDemo目录下,运行项目 cd RNDemo react-native run-android 运行成功如下图: 二.项目目录 app文件夹 -- 自己创建的,自己写的页面都放在这里面 App.js -- 整个应用的根容器 index.js -- 在这里面将A