一、前言
一般我们在手机上调试移动端有很多种方法,比如用uni写的项目可以用HBuilderX来运行在手机上调试,这种就比较简单,还有就是比如用vue+vant来写的,我们就不能用这种调试方法了。这篇文章就记录一下手机版Chrome的调试方法。
二、准备工作
2.1、下载手机版Chrome
我们需要在手机上下载一个Chrome,Chrome一般在应用商店里面没有,需要去浏览器百度搜索安卓版Chrome下载,并且鸿蒙系统的不兼容,如图1。

图1
三、连接电脑与手机
3.1、打开手机开发者模式
把手机的开发者模式打开,打开手机设置------系统------关于手机------版本号,快速点击版本号,开发者模式就打开了,然后在设置------开发者选项-USB调试开关,将USB调试打开,如图2。

图2
3.2将电脑与手机进行连接
用数据线把手机和电脑连接起来,这时候手机会弹出一个允许USB调试提示,直接点击允许,如图3。

图3
四、运行调试
1.打开Chrome浏览器
在电脑的Chrome的地址栏输入:chrome://inspect/#devices,如图4。

图4
2.在手机Chrome浏览器上输入需要调试的项目运行的地址。
3.开始调试
在devices页面就会出现手机上输入的地址,在地址下面有一个inspect或者inspect fallback,点击就可以打开,如图5。打开后就与我们手机上打开的页面一样了。这时候在手机上调试,电脑上就可以看见打印的东西了,如图6。

图5

图6
五、可能遇到的问题
在我们的调试页面出现404Not Found,可能没有inspect fallback这个按钮是因为手机里装的Chrome浏览器跟电脑的版本不一样就会出现这个问题,如图7。

图7
以上就是我们本期对手机版Chrome的调试方法教程。