前端项目实现手机端调试

实现效果

手机端浏览器实际预览前端项目

准备物料

开发工具VsCode
工程:Vue
Android手机一台
Android手机下载 Android For Firefox 浏览器的app
电脑安装Firefox (版本用最新的即可,当前99)
保证电脑和手机在同一个网络

步骤一 手机打开USB调试,华为手机举例,步骤如下

image.png

image.png

image.png

通过USB数据线连接手机,弹出提示框,选择“xxx文件”

步骤二 2.服务启动: vscode中对应的Vue工程进行启动,如:

npm run serve 得到ip 如图


image.png

步骤三 打开手机上的Firefox ,打开设置,打开USB链接,并且在浏览器输入ip和端口访问

image.png

image.png

image.png

步骤四 打开电脑端的Firefox,右边更多,更多工具

image.png

image.png

image.png

最终如下图就可以调试了


image.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容