方法一:在public目录下index.html文件中引入vconsole.min.js
<script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>
再到需要查看控制台的页面的created中使用new vConsole 实例
created() { var vConsole = new window.VConsole(); console.log(vConsole); },
beforeDestroy() {
vConsole.destroy();// 不需要用到时销毁
},
接下来咱们就能在页面上看到
方法二:cmd用npm安装VConsole
npm install vconsole
安装完成直接进入项目引入使用即可
import VConsole from 'vconsole'; creatrd(){ const vConsole = new VConsole(); // 两种方法取其一 const vConsole = new VConsole({ theme: 'dark' }); // 打印测试 console.log('Hello world'); }, beforeDestroy() { vConsole.destroy();// 不需要用到时销毁 },
两种方法效果相同,我倾向于第一种方法比较方便
PS:还有注意了,调试完成一定一定一定记得删除
更多vConsole使用教程方法可以去
github:https://github.com/Tencent/vConsole文章来源:https://www.toymoban.com/news/detail-524955.html
gitee:https://gitee.com/Tencent/vConsole文章来源地址https://www.toymoban.com/news/detail-524955.html
到了这里,关于前端必须知道的手机调试工具vConsole的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!