1.1　搭建微信小程序开发环境

本节主要介绍如何申请小程序账号与安装微信小程序开发工具。

1.1.1　申请微信小程序账号

想要进行微信小程序开发，必须有自己的微信开发者账号。微信公众平台的超链接为https://mp.weixin.qq.com，以下是注册的具体过程。

在微信小程序的学习过程中，开发者可以以微信官方提供的简易教程为参考，简易教程链接为https://developers.weixin.qq.com/miniprogram/dev/。进入简易教程后，选择“申请账号”，并单击“小程序注册页”按钮进入小程序注册页面，如图1-1所示。

小程序的注册流程共分为3步，即账号信息填写、邮箱激活、信息登记，如图1-2所示。

1．账号信息

账号信息包括邮箱、密码、确认密码和验证码，填写完毕后，勾选“你已阅读并同意《微信公众平台服务协议》及《微信小程序平台服务条款》”复选框，勾选后单击“注册”按钮提交填写好的账号信息。

注意，所填邮箱必须满足以下条件：

（1）未注册过微信公众平台；

（2）未注册过微信开发平台；

（3）未用于绑定过个人微信号。

其中，每个邮箱只能申请一个小程序，如果开发者没有能满足条件的邮箱，可以先申请一个新的邮箱，再进行小程序账号的注册。

2．邮箱激活

在账号信息提交后，进入“邮箱激活”页面，单击“登录邮箱”按钮，登录注册小程序的邮箱查看激活文件，如图1-3所示。

单击邮箱中的超链接，即跳转回微信平台页面并完成邮箱激活，如图1-4所示。

3．信息登记

完成邮箱激活后，进入“信息登记”页面，其中“注册国家／地区”选择默认选项“中国大陆”，“主体类型”根据开发者实际情况进行选择，主要有个人、企业、政府、媒体以及其他组织5种，本书主要以个人类型为例进行讲解，如图1-5所示。

选择个人类型后，页面会出现“主体信息登记”，如图1-6所示。

填写主体信息时，用户需要如实填写身份证姓名、身份证号码和管理员手机号（注意，一个身份证号码或一个手机号只能注册5个小程序），然后单击“获取验证码”按钮，待手机接收到验证码后，填入接收到的6位验证码。

填写完管理员身份信息后，“管理员身份验证”一栏会自动生成一个二维码，开发者使用本人微信扫描页面提供的二维码，扫码后，手机微信会自动跳转到“微信验证”页面，如图1-7所示。开发者核对微信验证页面上所显示的姓名与身份证号无误后，单击“确定”按钮，系统会提示“你的身份已验证”，如图1-8所示。

手机微信上确认后，该微信号会被登记为管理员微信号，“信息登记”页面也会提示“身份验证成功”，单击“继续”按钮进入下一步，系统弹出提示框，让开发者最后确认提交的主体信息，如图1-9所示。单击“确定”按钮，会弹出“信息提交成功”提示框，如图1-10所示。

此时单击“前往小程序”按钮直接进入小程序后台管理页面，如图1-11所示。管理员后续可通过访问微信公众平台（mp.weixin.qq.com）手动输入账号和密码登录小程序管理页面。

1.1.2　安装微信小程序开发工具

开发小程序需要进行开发工具下载，在简易教程中的左侧导航栏选择“安装开发者工具”，进入安装开发工具教程，单击“开发者工具下载页面”按钮即可进入工具下载页面，如图1-12所示。

进入工具下载页面后，可以发现开发工具分为“开发版”“测试版”“稳定版”和“内核升级版”，如图1-13所示。为保证开发工具的稳定性，本书建议开发者选择稳定版，并根据计算机操作系统选择对应的软件进行下载。

下载完成后，用户会获得一个.exe应用程序文件，如图1-14所示。

双击该文件进行开发工具的安装，如图1-15所示。

安装完成后，会提示“安装完成”，单击“完成”按钮即可，如图1-16所示。

双击桌面“微信web开发者工具”图标（注：此处web的正确写法应为Web，下同），即可运行微信开发者工具，开发者用微信进行扫描登录，扫描成功后，在手机端单击“确认登录”按钮即可登录并使用微信开发者工具，如图1-17所示。

1.1.3　创建Hello World小程序

双击打开微信Web开发者工具，在左侧导航栏选择“小程序”选项，单击菜单栏中“+”按钮，进入“新建项目”页面，如图1-18与图1-19所示。

进入“新建项目”页面，开发者需要依次填写“项目名称”和AppID，并选择“目录”“开发模式”“后端服务”和“语言”。填写注意事项如下。

• 　项目名称：开发者可根据项目自定义一个项目名称。
• 　AppID：每个小程序账号都有一个AppID，小程序管理员可在微信公众平台查看自己的AppID。AppID必须填实际的小程序AppID，否则部分功能将无法使用。如果开发者条件暂时受限，无法注册申请小程序ID，可以选择AppID下方的测试号新建小程序，但是无法实现真机调试功能。

• 　目录：项目代码包存放的路径地址，可选择默认的目录，也可以选择自己新建的空文件夹所在的目录。
• 　开发模式：有两个选项，分别是“小程序”和“插件”。其中，插件是可被添加到小程序内直接使用的功能组件。开发者可以像开发小程序一样开发一个插件，供其他小程序使用。同时，小程序开发者可直接在小程序内使用插件，无须重复开发，为用户提供更丰富的服务。本节案例选择“小程序”开发模式。
• 　后端服务：可选择“不使用云服务”或“小程序·云开发”。云开发为开发者提供完整的云端支持，弱化后端和运维概念，无须搭建服务器，使用平台提供的API进行核心业务开发，即可实现快速上线和迭代，同时这一功能同开发者已经使用的云服务相互兼容。本节案例选择“不使用云服务”。
• 　语言：可选择JavaScript或TypeScript。本书主要以JavaScript作为开发语言进行讲解。

小程序的AppID可以登录微信公众平台查看。登录小程序账号后，进入小程序后台管理页面，在左侧导航栏选择“开发”选项，顶部tab栏选择“开发设置”即可查看AppID，如图1-20所示。该AppID需要单独记录和保存，以便于开发工具的登录。

填写完新建项目中的各个信息后，单击“新建”按钮完成Hello World小程序的新建，Hello World小程序界面如图1-21所示。

到此为止，一个小程序的运行环境就搭建好了。可以看到简单的Hello World小程序呈现在面前，是不是有一点小小的成就感？

Mac平台的小程序运营环境搭建步骤大体与此相似，本文不赘述。