移动端调试方式

现在移动端开发愈发火热,各种H5页面功能,但是在移动端有一个弊端就是调试比较麻烦,之前用过一些调试的工具有以下几种方式:
1、weinre
官网地址:http://people.apache.org/~pmuellr/weinre/docs/latest/
weinre调试的话需要PC和手机都在同一个局域网下,可以在控制台看到报错信息,可以打断点,可以实时更改css样式等等,功能比较强大,当时操作较为繁琐。

2、通过vConsole进行调试
引入vConsole插件
yarn add vconsole -s

npm install vconsole -D
使用的时候需要在我们入口文件引入vConsole并且初始化:
import Vconsole from 'vConsole' ;
const vConsole = new Vconsole()

然后在你需要看log的地方输入console.log就可以了,vconsole使用简单,可以看到log日志,查看接口调用,查看页面布局,但是不能实时的去更改样式进行调试,只能查看打包后的运行效果。

3、入市微信公众号页面的调试,在android机型上是可以不用安装vconsole插件的,可以直接在微信浏览器里面打开:http://debugx5.qq.com ,打开网址之后,往下翻,把vConsole调试功能打开并且关闭两个X5的Cache功能。

移动端调试方式_第1张图片

重新进入你要调试的页面,在右下角会有一个绿色的vConsole按钮,点击该按钮就可以进行调试了。

你可能感兴趣的:(前端,vue.js)