微信小程序调试工具详解

　　微信小程序调试工具是为了帮助开发者在开发小程序的时候能够简单和高效，目前存在的小程序开发者工具就集开发调试、代码编辑及小程序发布等功能于一体。接下来就一起来了解下微信小程序调试工具吧。

　　小程序调试工具详解：

　　调试工具分为6大小程序功能模块：Wxml、Console、Sources、Network、Appdata、Storage

　　Wxml panel

　　Wxml panel 用于帮助开发者开发 Wxml 转化后的界面。在这里可以看到真实的页面结构以及小程序结构对应的 wxss 属*，同时可以通过修改对应 wxss 属*，在模拟器中实时看到修改的情况。通过调试模块左上角的选择器，还可以快速找到页面中组件对应的 wxml 代码。

　　Sources panel

　　Sources panel 用于显示当前项目的脚本文件，同浏览器开发不同，微信小程序框架会对脚本文件进行编译的工作，所以在 Sources panel 中开发者看到的文件是经过处理之后的脚本文件，开发者的代码都会被包裹在 define 函数中，并且对于 Page 代码，在尾部会有 require 的主动调用。

　　Network panel

　　Netwrok Pannle 用于观察和显示 request 和 socket 的请求情况

　　Appdata panel

　　Appdata panel 用于显示当前项目当前时刻 appdata 具体数据，实时地反馈项目数据情况，可以在此处编辑数据，并及时地反馈到界面上。

　　Storage panel

　　Storage panel 用于显示当前项目的使用 wx.setStorage 或者 wx.setStorageSync 后的数据存储情况。

　　Console panel

　　Console panel 有两大功能：

　　开发者可以在此输入和调试代码

　　小程序的错误输出，会显示在此处

　　小程序操作区

　　小程序操作区帮助开发者模拟一些客户端的环境操作。例如当用户从小程序中回到小程序聊天界面，会触发一个小程序被设置为后台的api。

　　当小程序使用到多窗口的时候，可以在顶部操作区进行页面切换，需要注意的是这个操作只是为了方便开发者才存在的，在真实的微信客户端中是不会有的。

　　相信大家看完之后都明白了微信小程序调试工具到底是用来干嘛的，如果你要成为一个小程序开发者，那么一定要详细了解微信小程序调试工具，还想获取更多相关资料就在微信小程序商店搜索吧。

　　小程序工具开发完有什么好处?

　　为什么我的微信中没有小程序工具?

　　微信小程序工具如何使用?