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

网站首页 > 技术文章 正文

vConsole，手机前端开发调试利器

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

前言

作为开发者，我们诉求：有没有快捷的方法在手机前端页面看到log日志？

vConsole前端调试面板

vConsole是一款由微信公众平台前端团队打造的前端调试面板、专治手机端看log难题。

使用方法

首先，在需要展示日志的页面引入vConsole模块。我们建议在<head>中而非<body>底部引入，方便后续的新版本vConsole在页面初始化时预埋各种debug钩子。

<script src="https://cdn.bootcss.com/vConsole/3.3.4/vconsole.min.js"></script>
<script>
  // 初始化
  var vConsole = new VConsole();
  console.log('Hello world');
</script>

使用es6 webpack引入

npm install vconsole
或者
cnpm install vconsole
或者
yarn add vconsole
 
然后设置个环境变量作为区分线上线下环境，比如：
 
import VConsole from 'vconsole';
 
const isDebug = true;
// 本地开发调试注入vConsole
if (isDebug) {
    new VConsole();
}

Tags：

猜你喜欢

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

欢迎 你 发表评论:

最近发表
标签列表