vscode 移动端真机测试项目

最新推荐文章于 2024-05-02 16:00:41 发布
最新推荐文章于 2024-05-02 16:00:41 发布
阅读量9.2k 收藏 4
点赞数 4
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xu838209490/article/details/90290085
版权

1、安装 live server 插件

2、vscode右下角会有 Go Live 标识点击

3、cmd ipconfig 查询自己电脑的ip地址

4、复制地址替换端口前的地址

5、移动端即可预览

輕描淡寫以後的以後
关注
  • 4
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
vscode通过wifi调试真机的Flutter应用的教程
01-20
首先：我是在vscode 1.41.1版本下，Flutter 1.13.6版本测试wifi远程调试。 1，首先安装 ADB Commanads for VSCode扩展 并且必须确保ADB已经添加到系统环境变量中 如未添加请按照下面的方式添加，如添加请直接跳到下面。 2，添加环境变量 我将ADB安装到这个目录下，请查找自己的安装目录。 将这个目录添加到下面的图片中 到此环境变量安装完成。 3，连接真机 3.1，真机用usb连接电脑 3.2，在vscode中按快捷键 Ctrl + Shift + P 3.3， 选择 Disconnect from any devices 3.4，在选Rese
自定义创建项目 面经移动端项目
09-03
在本项目中，“自定义创建项目 面经移动端项目”是一个基于移动端开发的Vue.js应用，主要关注的是前端开发的配置与构建流程。通过分析提供的压缩包子文件的文件名称列表，我们可以深入探讨这个项目中涉及到的关键...
移动端真机调试方法
weixin_34061482的博客
12-17 420
最近要分析web页面，在安卓和ios上的性能差异，除了操作系统本身不同之外，应该还多地方要探究的，第一步就是要在真机上分析。所以总结一下几个方法。 1.Mac+iPhone+Lightning+Safari 浏览器 步骤： 1）用：Lighting线将mac与iphone相连 2）iphone打开Web检查器（设置->Safari->高级->Web检查器） 3）iph...
使用VS Code进行Auto.js开发时使用ADB连接安卓手机设备
最新发布
k666345的博客
05-02 428
手机数据线连接电脑，开启调试模式，无障碍服务，和Auto.js app上的USB调试开关，输入命令连接设备，👇。如果要关闭adb，在任务管理器中找到adb.exe停止运行即可。看到successfully就是运行成功，cmd窗口可以关闭。下载完解压后进入文件夹中，打开它的cmd，输入。按F5运行代码，可以在手机上看到输出内容。
VS Code真机测
weixin_40092506的博客
11-15 387
VS Code真机测试步骤 前提：你的电脑跟你的手机是在同一个网络环境下。电脑连手机热点； 1． 在扩展里搜索live server，下载安装； 2． 打开cmd 命令窗口（快捷键是win+r）； 输入ipconfig；复制 ipv4址，同步 vscode中的Live Server中的host 。重启你的vs code； 将要测试的页面用vscode打开，运行底部的Go Live； 在...
vscode真机调试
半兽先生的博客
01-11 1441
vscode真机调试
VS Code真机测试步骤
热门推荐
weixin_34226706的博客
05-26 1万+
VS Code真机测试步骤 前提：你的电脑跟你的手机是在同一个网络环境下。电脑连手机热点； 1．在扩展里搜索live server，下载安装； 2．打开cmd 命令窗口（快捷键是win+r）； 输入ipconfig；复制 ipv4址，同步 vscode中的Live Server中的host。重启你的vs code； 3. 将要测试的页面用vscode打开，运行底...
在vscode中使用Live Server 真机调试
m0_64520392的博客
06-27 3211
Vscode Live Server 安装并使用 移动端真机调试
详解VSCode配置启动Vue项目
10-17
本文将详细介绍如何在VSCode中配置启动Vue项目，以便高效地进行Vue应用的开发。 首先，确保你已经下载并安装了最新版本的VSCode。你可以通过搜索引擎搜索"VSCode最新版"来获取安装程序。安装完成后，按下`Ctrl + ...
vscode环境搭建及项目启动
08-27
VSCode 环境搭建及项目启动 VSCode 环境搭建及项目启动是一个重要的步骤，对于开发者来说，掌握这个步骤可以提高开发效率和质量。下面，我们将详细介绍如何搭建 VSCode 环境和启动项目。 一、安装 Node.js 在开始...
vscode+Firefox实现前端移动真机测试
qq_36609655的博客
07-31 5373
需要配件: 1.安装有火狐浏览器的移动端(手机); 2.安装有火狐浏览器和vscode的pc(电脑); 3.在vscode安装Live Server 插件  4.安装之后vscode右下角会有Go Live这个标识  5.点击 Go Live 会在默认浏览器打开一个网页,我设置的火狐为默认浏览器,直接打开火狐 下面是我的火狐跳转页面 6.通过火狐自带网址二维码小功能,实...
code 真机程序发布测试
05-31 324
转自：http://www.cnblogs.com/yaokang/archive/2012/05/29/2524273.html 一、发布测试，是指将你的程序给   * 你的测试人员，因为程序总归是要测试的   * 你的客户，在正式发布之前，客户肯定是要先看（验收）的 在他们的iOS设备（iphone,ipod, ipad）安装，运行。   二，阅读前提：你自己已经完成了
webstorm 或者vscode在手机上测试
xwyzsn的博客
03-10 733
需求 (刚自学前端)之前写了一段js的代码设计到获取时间的new Date(),然后再电脑上测试都好好的,然后用GitHubpage部署了一些,就发现错误,时间显示NaN,这就很痛苦,所以就想着能够在手机上先预览以下页面。 实现 这里讲一种简单的方式，首先下载个360WIFI，或者其他wifi软件，然后电脑打开wifi手机连接WIFI.此时,在CMD中输入ipconfig 找到这一个IP信息，就是你电脑的 内网的IP信息,然后把localhost的网址换成以上的IP地址即可。比如 http://localh
VSCode使用
冷酷到底
04-09 572
之前学H5学会使用VSCode，干了几个月android没写h5，今天拿起来写h5页面，发现忘光了。。。。。先复习顺便记忆一下现在需要掌握的状态：1.这是我之前安装的插件，有几个不知道用来干嘛的，后续查到了补充。2.写好页面的运行：之前我已经装好NodeJS了，可以配合使用，记一下使用：Ctrl+~调出控制台lite-server运行index.html在浏览器...
开发移动端在真机上面调试的方法
weixin_39512883的博客
09-08 382
前言 开发移动端的时候通常大家F12打开控制台，点击模拟手机模式进行调试，还有一种更加方便的方法可以在开发过程中使用真机来看效果，便于调试 一、启动项目，将项目链接复制 http://localhost:8080/index 二、查看本机的ip地址 打开cmd窗口，输入命令行ipconfig，找到IPv4地址：192.168.xxx 三、用ip地址替换localhost 保证你的手机和电脑在同一wifi下面，用手机点击已经替换好的链接就可以在手机上看到效果了 ...
vscode Flutter真机调试
静静流淌的柯溪的博客
08-20 7417
1 为什么要真机调试 我们做app开发的时候，一般都是先在虚拟机上完成功能开发，等所有交互逻辑和业务逻辑基本调试ok后，才想着在真机上验证。 或者我们需要调试一些和硬件相关的业务时，也必须要真机调试，比如闪光灯、相机、蓝牙等等。 2 vscode Flutter真机调试步骤 2.1 手机打开USB调试 首先确定手机端打开了USB调试功能，将手机通过USB线连接电脑，如果一切正常，则在PC设备管理器中应该能找到Android USB devices，如下图所示： 如果找不到usb device的驱动，则首先
使用真机调试H5页面
阿Gogo
07-02 1440
手机和电脑处于同一个局域网下面。 本地电脑开启服务。例如可以使用vscode开启服务（使用vscode下载Live Serer插件，设置好端口和地址后一键开启服务，方便调试）。 查看本地电脑的ip地址。 使用ip地址+端口+文件地址生成二维码。 使用客户端扫描上一步生成的二维码进行调试。 ...
移动端必备——手机模拟器
Poppy_tester的博客
04-24 5957
作为一个测试，今天才知道有手机模拟器的存在真的是有点过分了（作为一个不玩游戏且主要测试web端的测试而言也挺正常的），如果要测试移动端，这个真的是一个神器。今天体验了一下觉得真的蛮不错的，只是有些深入的操作比如进行自动化侧测试还需要进一步实践。 夜神模拟器一款安卓主流的手机模拟器，可以让你一次拥有多部手机的配置，甚至比真机还要顺滑。夜神模拟器其实主要是为了广大游戏爱好...
使用 vscode 调试前端代码
weixin_33676492的博客
12-06 4078
使用 vscode 调试前端代码 今天我们以webpack项目为基础讲解配置 复制代码1. 安装插件 Debugger for Chrome 2. 修改 config/index.js 将devtool: 'cheap-module-eval-source-map' 修改为 devtool: 'source-map' 将 cacheBusting: true 修改为 cacheBustin...
vscode移动端flexible
08-23
VSCode移动端Flexible是一个用于移动端适配的插件。它可以将设计图上的像素单位(px)自动转换为相对单位rem，从而实现在不同屏幕尺寸上的自适应布局。通过使用Flexible，开发者可以方便地适配不同屏幕尺寸的移动设备，减少手动计算转换的工作量。同时，Flexible还提供了一些基本的用法，比如使用@media查询来设置不同屏幕尺寸下的样式。这样可以根据不同的设备宽度，为元素设置不同的背景颜色等属性，以实现更好的用户体验。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [使用Flexible实现移动端页面的终端适配，及快捷设置开发工具px转换rem](https://blog.csdn.net/u012716788/article/details/131065996)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [关于移动端的尺寸适配，vscode中支持自动转换的插件](https://blog.csdn.net/weixin_47655415/article/details/122217188)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值