移动端页面查看真机效果和调试
很久没有开发移动端的页面了,今天要用到的时候有点懵,还是记录一下方便后续查看
一.移动端真机查看效果
1.需要pc和手机在局域网
2.如果是cli搭建,需要改devServer.host为pc的ip地址(原:localhost 改:66.66.66.66)
3.这样手机就可以通过ip:端口号访问页面了(66.66.66.66:8085)
二.如果要调试(用的谷歌,需要FQ,网上有很多教程)
手机下载谷歌浏览器,并打开开发者模式,usb调试模式。
用手机上的谷歌访问页面
点击pc端控制台三个点下的More tools 下的Remote devices
(正常情况下在Devices 和 Settings中间会出你的手机标识,没有就是调试模式没打开,或者是手机没有信任授权)
然后点击这个手机标识控制台就会出现手机上的谷歌访问的页面的网址
点击inspect 会出现弹窗DevToolsApp(这里需要FQ,不然用不了,显示404)
好了可以调试了