移动端网页增加vconsole调试工具

发布于2019年2月26日 19:25:47

很久没更新了,可能是因为最近bug比较多,也可能是比较懒。

在平时的小程序开发中,我们可以借助它自带的vconsole工具调试,可以对我们的代码检测和开发效率有很大的帮助。然而平时我们在开发移动端时,一般都可以借助浏览器自带的响应模式来调试,但平时网页调试好的和我们真机上显示的有时会有误差,比如说,在pc网页上显示好好的,怎么到真机上就挂了,在微信浏览器里也显示不了呢。我最近就遇到了这个问题,用开发者工具上的网页模式调试的好好的,在pc网页端显示也正常,用局域网在真机上显示也正常,可啪,在网页版微信内置浏览器中无法显示。这时就找到了vconsle调试了,果真很好用呀。

在pc微信浏览器调试证明: 该环境下,1、不支持形参赋默认值;2、不支持ES6语法(即不支持let, const, 箭头函数等)

下面为vconsole用法:

在html页面中引入vconsole.min.js

Github地址:https://github.com/Tencent/vConsole

CDN地址:https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js

或 npm i vconsole

引入成功后初始化

<script>
  var vConsole = new VConsole();
  console.log('Hello world');
</script>

然后就可以在页面右下角看到vconsole调试工具了,点击即可看到相关的打印日志

本文共 1 个回复

  • WGinit 2023/06/25 21:56

    当需要打印更多日志信息时,推荐使用 eruda 第三方包

发表评论