微信开发者工具的使用

微信开发者工具的主界面主要由菜单栏，工具栏，模拟器，编辑器，和调试器组成。

1.菜单栏

常用的菜单如下

• 项目：用于新建项目，或打开一个现有的项目。
• 文件：用于新建文件、保存文件或关闭文件。
• 编辑：用于编辑代码，对代码进行格式化。
• 工具：用于访问一些辅助工具，如自动化测试、代码仓库等。
• 界面：用于控制界面中各部分的显示和隐藏。
• 设置：用于对外观、快捷键、编辑器等进行设置。
• 微信开发者工具：可以进行切换账号、更换开发模式、调试等操作。

2.工具栏

• 个人中心：位于工具栏最左侧的第一个按钮，显示当前登录用户的用户名，头像。
• 模拟器、编辑器和调试器：用于控制相应工具的显示和隐藏。
• 云开发：开发者可以使用云开发来开发小程序、小游戏，无须搭建服务器，即可使用云端能力。
• 模式切换下拉菜单：用于在小程序模式，搜索动态页和插件模式之间进行切换。
• 编译下拉菜单：用于切换编译模式，默认为普通模式，可以添加其他编译模式。
• 编译：编写小程序的代码后，需要编译才能运行。默认情况下，直接按Ctrl + S快捷键保存代码文件，微信开发者工具就会自动编译运行。如果要手动编译，则单击 编译 按钮即可
• 预览：单击预览俺就会生成一个二维码，使用手机中的微信扫码二维码，即可在微信中预览小程序的实际运行效果。
• 真机调试：可以实现直接利用开发者工具，通过网络连接对手机上运行的小程序进行调试。
• 切后台：用于模式小程序在手机中切后台的效果。
• 清缓存：用于清除数据缓存，文件缓存等。
• 上传：用于将代码上传到小程序管理后台，可以在开发管理中查看上传的版本，将代码提交审核。注意，如果创建项目时用的AppId是测试号，则不会显示上传按钮。
• 版本管理：用于通过Git对小程序进行版本管理

3.模拟器

模拟器用于模拟手机环境，查看不对型号手机的运行效果。

4.编译器

编辑器分为左右两栏，左栏用于浏览项目目录结构，右栏用于编写代码。

5.调试器

调试器类似于Google Chrome浏览器中的开发者工具。

下面对调试器中各个面板的功能进行简要介绍。

• Console:控制台面板，用于输出调试信息，也可以直接编写代码执行。
• Sources:源代码面板，可以查看或编辑源代码，并支持代码调试。
• Network:网络面板，用于记录网络请求信息，根据它可进行网络性能优化。
• Security:安全面板，用于调试页面的安全和认证等信息，如HTTPS
• AppData:App数据面板，可以查看或编辑当前小程序运行时的数据。
• Audits:审计面板，用于对小程序进行体验评分。
• Sensor:传感器面板，用于模拟地理位置，重力感应。
• Storage:存储面板，用于查看和管理本地数据缓存。
• Trace:跟踪面板，用于真机调试时跟踪调试信息。
• Wxml:Wxml面板，用于查看和调试WXML和WXSS。