VS Code开发React-Native及Flutter 开启无线局域网安卓真机调试问题
笔者前段时间在做react-native
开发,一直是有线连接安卓真机进行调试的。有线调试确实带来诸多麻烦,因为在调试过程中需要频繁和手机进行交互,导致有时候数据线脱落,就不得不重新安装debug apk,安装一次应用的时间大概在一到三分钟,大量的误触就使得花在安装应用花费的时间比较长。这几天在研究flutter,就上网搜了一下vscode 开发 flutter开启无线调试。然后顺藤摸瓜,把react-native
的无线调试也试了一下。
参考文章:vscode通过wifi调试真机的Flutter应用
Vscode插件地址:ADB Interface for VSCode
下面先介绍flutter如何开启安卓无线调试:
因为在开发react-native的时候已经装过了Android Studio 和 sdk,就直接跳过adb环境变量的配置,初次接触的可以点击上方的参考文章。
首先在vscode插件市场搜索 ADB Interface for VSCode并安装(install)
steps: First connect your device trough USB Run ADB:? Disconnect from any devices And run ADB:? Reset connected devices port to :5555 And Then ADB:? Connect to device IP enter your device (settings status ip address) IP address and be fine
步骤: 首先将你的手机与电脑通过数据线连接上; 然后打开命令面板(Ctrl + Shift + P),查找命令 ADB:? Disconnect from any devices并执行; 继续执行命令 ADB:? Reset connected devices port to :5555; 最后执行命令 Connect to device IP enter your device并输入你手机的局域网ip,如<192.168.0.3 进行连接,然后可以看到vscode 右下角会有个连接成功的提示
就表示远程连接成功,此时就可以拔掉数据线了。
然后就可以运行flutter run命令,进行无线调试,或者按住Fn + F5 进入debug模式,保存自动刷新,再也没有数据线干扰了,是不是美滋滋…
vscode插件市场有很多关于adb的插件,大家可以试试看其他的插件的易用性。
React-Native 无线调试教程:
首先基本步骤跟flutter一样,在无线连接成功后拔掉数据线,运行 yarn run android(react-native run-android
)= 具体看package.json文件的启动配置。安装好打开后会出现
不要慌,问题不大,这表明debug apk已经安装上了,只是加载不了脚本,所以要在电脑上运行脚本服务器,让安卓从电脑的端口动态获取脚本并执行(也就是hot reload热更新)
在vscode终端运行 yarn start(或者react-native start)
默认端口是8081,如果端口被占用可以在命令后加入 –port=指定的端口号 如react-native start --port=7999
在指定的端口运行,然后在浏览器中打开该端口地址
在vscode控制台也可以看到访问日志和调试日志
表示server正在运行,电脑端配置完毕,现在配置手机的debug setting 让手机连接到电脑的这个端口获取脚本。
晃动手机打开开发者菜单
选择Settings,
打开 Debug server host & port for device 输入 server地址 192.168.0.2.7999 然后晃动手机点击reload,或者退出应用重新进,就发现app运行成功了,日志输出在vscode的控制台上面。
总结
到此这篇关于VS Code开发React-Native及Flutter 开启无线局域网安卓真机调试问题的文章就介绍到这了,更多相关VS Code React-Native Flutter 无线局域网内容请搜索ZaLou.Cn以前的文章或继续浏览下面的相关文章希望大家以后多多支持ZaLou.Cn!
- ML中相似性度量和距离的计算&Python实现
- Oracle中的ROWID实现(r10笔记第95天)
- 100个Numpy练习【3】
- 100个Numpy练习【4】
- Golang语言中Path包用法
- 100个Numpy练习【5】
- Golang中container/list包中的坑
- 关于Golang语言数组索引的有趣现象
- 使用SQL来分析数据库参数(二)(r10笔记第82天)
- Golang不定参数
- [go语言]利用缓冲信道来实现网游帐号验证消息的分发和等待
- 转--Golang语言版 ssh口令破解工具
- cubieboard(树莓派)安装Ubuntu+Apache+PHP+Mysql
- Oracle 12c里的几点补充(一)(r11笔记第7天)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法