在前端开发过程中,经常会使用console.log/info 等方法来输出日志信息,电脑浏览器中可以方便的在控制台中查看
现在移动端的web开发越来越多,而在移动设备中进行开发调试时,console.log 这类的日志信息就不太容易查看了
vConsole 就是用来解决这个问题,可以让我们在移动设备中非常方便的查看console日志信息
vConsole 是由微信的前端研发团队提供,小巧好用
DEMO
示例页面
右下角的悬浮按钮用来打开控制台
控制台中显示日志
使用
(1)下载 vconsole
项目地址 https://github.com/WechatFE/vConsole
(1)页面中引用 vconsole.min.js
(2)JS代码中正常使用 console.log/info/debug/warn/error 即可
示例代码
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="vconsole.min.js"></script>
<script>
window.onload = function (){
console.log('hello world');
}
function testInfo(){
alert('info');
console.info('test info');
}
</script>
</head>
<body>
<h1>vConsole test</h1>
<button onclick="testInfo()">INFO</button>
</body>
效果
微信前端团队提供的日志工具 vConsole
原创mob604756f2af3b ©著作权
©著作权归作者所有:来自51CTO博客作者mob604756f2af3b的原创作品,请联系作者获取转载授权,否则将追究法律责任
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
实时监控 Odoo 日志并通过企业微信通知
报警机器人
Python 微信 错误日志 odoo -
微信ipad协议
微信ipad最新版
微信 API sed -
移动端vconsole日志
实例化后才能使用。在不用添加前缀基于得到第一个相应元素
javascript 开发语言 ecmascript 实例化 ide -
【开源工具】前端开发 微信小程序
https://github.com/NervJS/tarohttps://taro.jd.com/
小程序 js uni-app 开发者 H5 -
【微前端】微前端——功能团队中缺失的一块拼图
在任何合法的前端开发团队中,提高可扩
大数据 编程语言 面试 java 数据库 -
微信企业微信调试JS神器vConsole
在js页面上放以下代码 在右下角就会出现一个图标 点开就可以查看各种错误,网络发送接收信息等
笔记 css javascript 各种错误 系统