在移动端使用VConsole调试面板

1.VConsole是什么？

作为前端而言，通常习惯在PC通过F12使用调试面板，进行调试或者查看接口信息等。
在移动端我们可以使用VConsole来实现相同的功能。它是一个网页前端调试面板，专为手机 web 页面量身设计，帮助开发者更为便捷地进行开发调试工作。
VConsole的git地址：https://github.com/WechatFE/vConsole

以下内容直接 copy 了项目的 README.md：
手机预览：

或者打开地址：http://wechatfe.github.io/vconsole/demo.html

2. 使用方法

2.1 npm

首先安装：

	npm install vconsole

然后页面引入：

import VConsole from 'vconsole'

然后再初始话(单独页面使用或全局在main.js中使用)

const  vs = new VConsole()
// 如果全局使用加上下面的代码
// Vue.use(vs)

2.2下载模块到本地

下载 vConsole 的最新版本。
(因为一直在更新，建议到官方git地址查看)

引入 dist/vconsole.min.js 到项目中：

<script src="path/to/vconsole.min.js"></script>
<script>
  // 初始化
  var vConsole = new VConsole();
  console.log('Hello world');
</script>

2.3对于 TypeScript

可引入 d.ts 文件：

import 'path/to/vconsole.min.d.ts';

2.4结果就是出现vconsole悬浮按钮

3. 教程

大家可以查看官网教程
https://github.com/Tencent/vConsole/blob/dev/doc/tutorial_CN.md