vconsole 移动端的调试利器
- 作者：朱桂彪
- 类型：图文教程
- 点击次数：
- 发布时间：2019-04-11 17:49
在使用mui等做手机端混合APP时，真机调试问题非常的麻烦，之前介绍过《如何使用电脑上的谷歌浏览器来调试安卓手机上的移动端页面》，这个方法很不错，就是初次使用很麻烦，还需要翻墙。今天介绍的这个 vconsole 就很简单，就是引用一个js，模拟电脑端的firebug来实现调试效果，有点类似于很久之前出来的一款专门针对IE6的《IE6的firebug，IE6css调试工具》：
先看下效果：
1、当页面使用了vconsole之后，就会在页面显示一个绿色的按钮：
2、点击这个绿色的按钮，就会打开控制台，里面的功能一应俱全，包括请求接口、打印的log、storage存储、dom节点等等：
使用方法：
1、使用 npm 安装：
(责任编辑：网页模板)
先看下效果：
1、当页面使用了vconsole之后，就会在页面显示一个绿色的按钮：
2、点击这个绿色的按钮，就会打开控制台，里面的功能一应俱全，包括请求接口、打印的log、storage存储、dom节点等等：
使用方法：
1、使用 npm 安装：
npm install vconsole2、使用webpack，然后js代码中:
import VConsole from 'vconsole/dist/vconsole.min.js' //import vconsole let vConsole = new VConsole() // 初始化或者找到这个模块下面的 dist/vconsole.min.js ，然后复制到自己的项目中:
<head>
<script src="dist/vconsole.min.js"></script>
</head>
<!--建议在 `<head>` 中引入哦~ -->
<script>
// 初始化
var vConsole = new VConsole();
console.log('VConsole is cool');
</script>
(责任编辑：网页模板)
- 本文标签：
- vconsole
