## 調試 ### [](https://developers.weixin.qq.com/miniprogram/dev/framework/usability/debug.html#vConsole)vConsole 在真機上，如果想要查看?console?API 輸出的日志內容和額外的調試信息，需要在點擊屏幕右上角的按鈕打開的菜單里選擇「打開調試」。此時小程序/小游戲會退出，重新打開后會右下角會出現一個?vConsole?按鈕。點擊?vConsole?按鈕可以打開日志面板。 小程序和小游戲的 vConsole 展示內容會有一定差別，下圖左邊是小程序 vConsole，右邊是小游戲 vConsole ? #### [](https://developers.weixin.qq.com/miniprogram/dev/framework/usability/debug.html#vConsole-%E4%BD%BF%E7%94%A8%E8%AF%B4%E6%98%8E)vConsole 使用說明 由于實現機制的限制，開發者調用?console?API 打印的日志內容，是轉換成?JSON?字符串后傳輸給?vConsole?的，導致?vConsole?中展示的內容會有一些限制： * 除了?Number、String、Boolean、null?外，其他類型都會被作為?Object?處理展示，打印對象及原型鏈中的 Enumerable 屬性。 * Infinity?和?NaN?會顯示為?null。 * undefined、ArrayBuffer、Function?類型無法顯示 * 無法打印存在循環引用的對象 ~~~ let a = {} a.b = a console.log(a) // 2.3.2 以下版本，會打印 `An object width circular reference can't be logged` ~~~ 針對上述問題，小程序/小游戲在使用 vConsole 時做了一些處理 * 2.3.2 及以上版本，支持打印循環引用對象。循環引用的對象屬性會顯示引用路徑，@表示對象本身。 ~~~ const circular = { x: {}, c: {} } circular.x = [{ promise: Promise.resolve() }] circular.a = circular circular.c.x0 = circular.x[0] console.log(circular) // "{a: '<Circular: @>', c: {x0: '<Circular: @.x[0]>'}, x: [{promise: '<Promise>'}]}" ~~~ * 2.3.1 及以上版本，支持展示所有類型的數據。基礎庫會對日志內容進行一次轉換，經過轉換的內容會使用<>包裹。如： * * * * * * ... * 2.2.3 ~ 2.3.0 版本中，可以展示?ArrayBuffer?和?Function?類型，undefined?會被打印為字符串?'undefined' **注：盡量避免在非調試情景下打印結構過于復雜或內容過長的日志內容（如游戲引擎中的精靈或材質對象等），可能會帶來額外耗時。為了防止異常發生，日志內容超過一定長度會被替換為，此時需要開發者裁剪日志內容。** ### [](https://developers.weixin.qq.com/miniprogram/dev/framework/usability/debug.html#Source-Map)Source Map > 目前只在 iOS 6.7.2 及以上版本支持 小程序/小游戲在打包時，會將所有 js 代碼打包成一個文件，為了便于開發者在手機上調試時定位錯誤位置，小程序/小游戲提供了?[Source Map](https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit)?支持。 在開發者工具中開啟 ES6 轉 ES5、代碼壓縮時，會生成 Source Map 的?.map?文件。開發版小程序中，基礎庫會使用代碼包中的?.map?文件，對 vConsole 中展示的錯誤信息堆棧進行重新映射（只對開發者代碼文件進行）。  如果使用外部的編譯腳本對源文件進行處理，只需將對應生成的 Source Map 文件放置在源文件的相同目錄下 如： > pages/index.js > pages/index.js.map > app.js > app.js.map 開發者工具會讀取、解析 Source Map 文件，并進行將其上傳 后續可以在小程序后臺的運營中心可以利用上傳的 Source Map 文件進行錯誤分析 1. **Source Map 文件不計入代碼包大小計算。** 2. **開發版代碼包中由于包含了?.map?文件，實際代碼包大小會比體驗版和正式版大。** ### [](https://developers.weixin.qq.com/miniprogram/dev/framework/usability/debug.html#%E7%9C%9F%E6%9C%BA%E8%B0%83%E8%AF%95)真機調試 真機遠程調試功能可以實現直接利用開發者工具，通過網絡連接，對手機上運行的小程序進行調試，幫助開發者更好的定位和查找在手機上出現的問題。