1.下载安装包

下载地址门户：

您可以根据所需的操作系统版本下载

2.安装微信Web开发人员工具

下载的安装软件包wechat_devtools大小接近80M

跳过特定的安装过程，只需下一步

3.申请小程序管理员帐户，获取开发者AppID

申请帐户：供参考

获取AppID：小程序管理平台->开发人员设置->开发人员ID

微信Web开发人员工具打开小程序项目时，AppID将用于身份验证

管理员授权用于测试的4.小程序 微信帐户

当项目团队中有多个开发人员小程序时，例如多个开发和测试成员，管理员可以在小程序管理后台中添加成员并设置所需的权限

管理入口：小程序管理背景->用户身份->会员管理

以供参考

5.通过授权的微信扫描登录开发人员工具

首次打开微信Web Developer Tools，然后将弹出一个QR码提示框。使用以上授权的微信进行扫描：

扫描后，手机微信需要确认登录：

6.创建和导入项目（项目路径+项目名称+ AppID）

根据开发和测试的特定需求，单击[小程序 Project]

点击管理项右下角的“ +”符号

导入小程序软件包的目录路径，填写AppID（如果软件包中有相关设置，则导入程序目录后也可以自动填写此ID），项目名称，然后单击[确定]

7.预览和调试小程序

微信Web开发人员工具预览小程序和调试代码

除了微信Web开发工具中的预览功能外，还可以在先前授权的手机微信上实现预览效果

具体操作：单击微信Web Developer Tools右上角的[Preview]，该工具提示“正在编译JS文件”，过一会儿，您可以完成编译并显示QR码。此时，使用授权的微信扫描此QR码（每次编译的QR码有效20分钟以上），您可以预览小程序在手机微信上的实际效果