1.4　使用微信小程序开发工具

打开安装好的微信小程序开发工具，如图1-6所示。

单击“+”按钮，新建一个小程序，并为其设置项目名称、目录、AppID、开发模式、后端服务、语言等信息，如图1-7所示。

注意：

（1）AppID指微信小程序ID，读者可以根据需要注册新的账号或使用测试号。由于小程序支付需要使用正式账号，因此本书将使用微信小程序正式账号进行讲解。

（2）后端服务指微信小程序与后端连接的服务提供者，这里选中“不使用云服务”单选按钮。本书将引领读者自行搭建后台服务。

设置完毕后，单击“新建”按钮，将打开微信开发者工具，如图1-8所示，在此可对小程序项目进行开发和调试。页面上方是菜单栏，中间部分从左到右依次是模拟器、资源管理器和编辑器，编辑器的下方是调试器。

首先来认识一下菜单栏。左侧一组按钮用于显示或隐藏模拟器、编辑器、调试器，以及设置可视化和云开发，中间一组按钮用于开发过程中的程序编译、效果预览、真机调试和清理缓存，右侧一组按钮用于上传开发好的微信小程序并进行版本设置和管理，如图1-9所示。

中间部分是资源管理器的树形目录，其中列出了相关的微信小程序文件。选中某个文件，在右侧编辑器中将会显示对应的小程序代码。调试程序可以使用console.log，相关信息在右下方的调试器中显示，如图1-10所示。

单击菜单栏中的“编译”按钮，可在左侧模拟器中预览小程序的运行效果。除此之外，还可以单击“预览”按钮，在弹出的面板中选择“二维码预览”或“自动预览”方式，使用真实的移动终端预览小程序效果。

其中，“二维码预览”方式需要读者使用手机微信客户端扫码观看预览效果，如图1-11所示。“自动预览”方式可将当前开发状态的微信小程序发布到开发人员的手机上，在手机端预览微信小程序的运行效果，如图1-12所示。

注意：

微信小程序开发工具需要关联微信账号。可以单击微信头像选择开发者，如图1-13所示。