移动端debug调试

移动端 debug 调试

多针对公众号外链 h5 页面，调用微信的部分接口必须上真机才能看到效果。

vconsole

npm install vconsole

模块化导入
1
2
3
4
5
6
7
8
9
10
11
12
13
14
import VConsole from "vconsole/dist/vconsole.min.js"; //import vconsole
let vConsole = new VConsole(); // 初始化
// 初始化时可以自定义一些配置
window.vConsole = new window.VConsole({
  defaultPlugins: ["system", "network", "element", "storage"], // 可以在此设定要默认加载的面板
  maxLogNumber: 1000,
  // disableLogScrolling: true,
  onReady: function () {
    console.log("vConsole is ready.");
  },
  onClearLog: function () {
    console.log("on clearLog");
  },
});
直接引入

源码

复制  vconsole/dist/vconsole.min.js  的代码，到自己的项目中,在 html 中引入，直接使用

1
2
3
4
5
6
7
8
9
<head>
  <script src="dist/vconsole.min.js"></script>
</head>
<!--建议在 `<head>` 中引入哦~ -->
<script>
  // 初始化
  var vConsole = new VConsole();
  console.log("VConsole is cool");
</script>

eruda

<font style="color:rgb(64, 64, 64);">npm install eruda --save</font>

模块化引入
1
2
import eruda from "eruda/eruda.min.js"; // 引入工具包
eruda.init(); // 初始化
直接引入
1
2
3
4
5
6
7
<script
  type="text/javascript"
  src="https://cdn.bootcdn.net/ajax/libs/eruda/2.3.3/eruda.min.js"
></script>
<script>
  eruda.init();
</script>

本博客所有文章除特别声明外，均采用 CC BY-SA 4.0 协议 ，转载请注明出处！