Vconsole前端debug神器
2020-04-23 本文已影响0人
IFu的简书
最近在开发一款react移动端公众号,客户那边反馈了几个白屏问题。几个开发者的手机端都显示正常,给生产公众号添加alert帮助debug,显然不可取。客户那边看到这么多alert一定会炸毛。
通过咨询朋友并查阅资料,获得一款专用于移动端debug的神器→Vconsole。使用方法如下:
一、多页面应用
在每个页面上,
<script src="https://cdn.bootcss.com/vConsole/3.3.4/vconsole.min.js"></script>
<script>
// init vConsole
var vConsole = new VConsole();
console.log('Hello world');
</script>
二、单页面应用
首先install 加载
npm install vconsole //安装模块包
然后在项目的入口文件App.js中,
componentDidMount() {
const VConsole = new VConsole();
if(new RegExp('addQuery').test(document.location.href)) {
return VConsole;
}
}
最后,调试的时候加上?addQuery
比如网页地址是 https://help.aliyun.com/product/27099.html
调试的地址就是 https://help.aliyun.com/product/27099.html?addQuery