专业编程教程与实战项目分享平台

网站首页 > 技术文章 正文

安利一个前端移动端开发中的调试工具vconsole

ins518 2024-11-19 05:07:14 技术文章 9 ℃ 0 评论

简介

vConsole 是腾讯开源的一个网页调试面板,专为手机 web 页面量身设计,帮助开发者更为便捷地进行开发调试工作。
可能对于经常写h5的朋友们来说已经非常熟悉了,但是对于刚开始写h5,又苦于不知如何调试的人来说,还是值得一看。

项目地址:https://github.com/WechatFE/vConsole
复制链接 http://wechatfe.github.io/vconsole/demo.html 到微信浏览器即可预览demo




使用方法

npm install vconsole

手动引入

<script src="项目的路径/vconsole.min.js"></script>
<script>
  // 初始化
  var vConsole = new VConsole();
  console.log('Hello world');
</script>

或者使用CDN

<script type="text/javascript" src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js"></script>

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

在VUE中使用

import VConsole from 'vconsole'
const vConsole = new VConsole()
Vue.use(vConsole)

打印日志

 console.log("Hello world");
 console.info("Hello world");
 console.debug("Hello world");
 console.warn("Hello world");
 console.error("Hello world");

销毁vconsole

window.vConsole.destroy();

Tags:

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表