调试

vConsole

在真机上,如果想要查看 console API 输出的日志内容和额外的调试信息,需要在点击屏幕右上角的按钮打开的菜单里选择「打开调试」。此时小程序/小游戏会退出,重新打开后会右下角会出现一个 vConsole 按钮。点击 vConsole 按钮可以打开日志面板。

小程序和小游戏的 vConsole 展示内容会有一定差别,下图左边是小程序 vConsole,右边是小游戏 vConsole调试 - 图1调试 - 图2

vConsole 使用说明

由于实现机制的限制,开发者调用 console API 打印的日志内容,是转换成 JSON 字符串后传输给 vConsole 的,导致 vConsole 中展示的内容会有一些限制:

  • 除了 Number、String、Boolean、null 外,其他类型都会被作为 Object 处理展示,打印对象及原型链中的 Enumerable 属性。
  • Infinity 和 NaN 会显示为 null
  • undefined、ArrayBuffer、Function 类型无法显示
  • 无法打印存在循环引用的对象
    1. let a = {}
    2. a.b = a
    3. console.log(a) // 会打印 `An object width circular reference can't be logged`

针对部分问题,小程序/小游戏在使用 vConsole 时做了一些处理

  • 2.2.3 及以上版本中,可以展示 ArrayBuffer 和 Function 类型,undefined 会被打印为字符串 'undefined'

    Source Map

目前只在 iOS 6.7.2 及以上版本支持

小程序/小游戏在打包时,会将所有 js 代码打包成一个文件,为了便于开发者在手机上调试时定位错误位置,小程序/小游戏提供了 Source Map 支持。

在工具中进行代码压缩和打包时,会生成 Source Map 的 .map 文件。开发版小程序中,基础库会使用代码包中的 .map 文件,对 vConsole 中展示的错误信息堆栈进行重新映射(只对开发者代码文件进行)。

调试 - 图3

开发版代码包中由于包含了 .map 文件,代码包大小会比体验版和正式版大。

原文: https://developers.weixin.qq.com/minigame/dev/tutorial/usability/debug.html