不管时用哪种语言，哪种框架，调试永远都是一个避不开的话题

为我们提供了远程调试的功能，而这个功能需要Chrome浏览器的配合。

1. 首先浏览器一定要安装好React Developer Tool 插件

2. 连接手机或打开模拟器

3. 在项目工程目录执行

react-native run-android

4. 打开并点击Dev Settings（模拟器Command+m，真机摇晃手机）

5. 点击Debug server host & port for device,输入

localhost:8081

6.回到PC，若Android L 以上在终端中输入，以实现反向代理（不输入Android L以上可能无法连到浏览器）

adb reverse tcp:8081 tcp:8081

7. 打开浏览器http://localhost:8081/debugger-ui/

8. command + option + i ，打开开发者工具，会在此目录中找到源码，并可以下断点进行debug（摇晃手机，点击Reload）

React Native 入门 调试项目的更多相关文章

  1. React Native入门教程 1 -- 开发环境搭建

    有人问我为啥很久不更新博客..我只能说在学校宿舍真的没有学习的环境..基本上在宿舍里面很颓废..不过要毕业找工作了,我要渐渐把这个心态调整过来,就从react-native第一篇博客开始.话说RN也出 ...

  2. React Native入门教程2 -- 基本组件使用及样式

    在上一篇文章中,我们学会了如何搭建React Native的环境(React Native入门教程(笔记) 1 – 开发环境搭建),不知道你们是否搭建好了呢,如果还没有,那么快动起小手,来体验RN带给 ...

  3. React Native入门-刘望舒

    React Native入门(一)环境搭建与Hello World React Native入门(二)Atom+Nuclide安装.配置与调试 React Native入门(三)组件的Props(属性 ...

  4. React Native入门——布局实践：开发京东client首页（一）

    有了一些对React Native开发的简单了解,让我们从实战出发.一起来构建一个简单的京东client. 这个client是仿照之前版本号的京东client开发的Android版应用,来源于CSDN ...

  5. React Native 系列(三) -- 项目结构介绍

    前言 本系列是基于React Native版本号0.44.3写的,相信大家看了本系列前面两篇文章之后,对于React Native的代码应该能看懂一点点了吧.本篇文章将带着大家来认识一下React N ...

  6. React Native入门教程 3 -- Flex布局

    上一篇文章中介绍了基本组件的使用 React Native入门教程(笔记) 2 – 基本组件使用及样式 本节内容将继续沿用facebook官方例子介绍如何使用Flexbox布局把界面设计的多样化. 转 ...

  7. React Native 入门基础知识总结

    中秋在家闲得无事,想着做点啥,后来想想,为啥不学学 react native.在学习 React Native 时, 需要对前端(HTML,CSS,JavaScript)知识有所了解.对于JS,可以看 ...

  8. react native 入门实践

    上周末开始接触react native,版本为0.37,边学边看写了个demo,语法使用es6/7和jsx.准备分享一下这个过程.之前没有native开发和react的使用经验,不对之处烦请指出.希望 ...

  9. React Native 入门到原理（详解）

    抛砖引玉(帮你更好的去理解怎么产生的 能做什么) 砖一.动态配置 由于 AppStore 审核周期的限制,如何动态的更改 app 成为了永恒的话题.无论采用何种方式,我们的流程总是可以归结为以下三部曲 ...

随机推荐

  1. SAP Display picture

    program sap_picture_demo. set screen 200. TYPE-POOLS cndp. ***************************************** ...

  2. 用python随随便便做一个二维码叭~~~

    Python是目前最好的编程语言之一.由于其可读性和对初学者的友好性,已被广泛使用. 那么要想学会并掌握Python,可以实战的练习项目是必不可少的. 接下来,我将给大家介绍非常实用的Python项目 ...

  3. POI导出复杂Excel，合并单元格（1）

    /** * 导出复杂excel 合并单元格 (HSSFWorkbook) */ @GetMapping("/testHSSFWorkbook.do") public void te ...

  4. 一文详解｜Go 分布式链路追踪实现原理

    在分布式.微服务架构下,应用一个请求往往贯穿多个分布式服务,这给应用的故障排查.性能优化带来新的挑战.分布式链路追踪作为解决分布式应用可观测问题的重要技术,愈发成为分布式应用不可缺少的基础设施.本文将 ...

  5. 『现学现忘』Git后悔药 — 28、版本回退git reset --soft命令说明

    git reset --soft commit-id命令:回退到指定版本.(soft:柔软的) 该命令仅仅修改分支中的HEAD指针的位置,不会改变工作区与暂存区中的文件的版本. 实现上是只做了一件事情 ...

  6. ubuntu20.04安装测试uhttpd

    uhttpd是openwrt上运行一个高效小型Http服务,支持cgi, lua等特性.可以直接通过snap方式安装,如果是16.04,18.04或者20.04,snap已经默认安装了:如果是其它版本 ...

  7. Python 中生成器的原理

    生成器的使用 在 Python 中,如果一个函数定义的内部使用了 yield 关键字,那么在执行函数的时候返回的是一个生成器,而不是常规函数的返回值. 我们先来看一个常规函数的定义,下面的函数 f() ...

  8. Hippo4J v1.3.1 发布，增加 Netty 监控上报、SpringCloud Hystrix 线程池监控等特性

    文章首发在公众号(龙台的技术笔记),之后同步到博客园和个人网站:xiaomage.info Hippo4J v1.3.1 正式发布,本次发布增加了 Netty 上传动态线程池监控数据.适配 Hystr ...

  9. 算法竞赛进阶指南0x41并查集

    并查集简介 并查集的两类操作: Get 查询任意一个元素是属于哪一个集合. Merge 把两个集合合并在一起. 基本思想:找到代表元. 注意有两种方法: 使用一个固定的值(查询方便,但是在合并的时候需 ...

  10. React + Antd Menu组件实现菜单树

    准备好两个变量,一个用来保存平级菜单列表,一个用来保存遍历后的菜单树. 推荐后端返回平级菜单树,假如菜单比较多,可以直接结合find方法找到菜单,做搜索功能很省事. const [menuList, ...