![微信小程序实战入门(内含完整实例解析)](https://wfqqreader-1252317822.image.myqcloud.com/cover/463/22691463/b_22691463.jpg)
上QQ阅读APP看书,第一时间看更新
1.3 创建小程序
安装完毕之后,在应用程序里面找到微信web开发者工具,双击运行。这时需要管理员或者绑定的开发者使用手机微信扫码登录,如图1-27所示。
![](https://epubservercos.yuewen.com/C1A53A/11261876104972506/epubprivate/OEBPS/Images/figure_0017_0002.jpg?sign=1739640631-EnF2Pw3YFj6O27CkNotzAybRKY9bd6wC-0-d644743b0d0d299ef2ef92aeac92bfa9)
图1-27 微信开发工具登录界面
扫码登录之后,可以看到如图1-28所示的界面。
![](https://epubservercos.yuewen.com/C1A53A/11261876104972506/epubprivate/OEBPS/Images/figure_0017_0003.jpg?sign=1739640631-KeLIP9OZXRisQdbObZTEQxdnE9q8zoEC-0-0bc939f6f66b33e1b25e831873aff740)
图1-28 微信开发工具首页
单击“本地小程序项目”,进入项目列表界面,如图1-29所示。在这里可以创建新的项目,也可以打开历史创建的项目。
![](https://epubservercos.yuewen.com/C1A53A/11261876104972506/epubprivate/OEBPS/Images/figure_0018_0001.jpg?sign=1739640631-vxjJTjwRa68MhchzmyohtktcxuETuKbi-0-8c160989a708f11ee5e69e11b780cd8f)
图1-29 小程序项目列表
单击“添加项目”,输入小程序的AppID(个人开发者可以选择无AppID来学习小程序开发),输入项目名称,选择本地空文件夹作为项目目录,如图1-30所示。注意:“项目目录”可以选择本地已有的小程序项目,单击“添加项目”即可完成微信小程序项目的导入。
![](https://epubservercos.yuewen.com/C1A53A/11261876104972506/epubprivate/OEBPS/Images/figure_0018_0002.jpg?sign=1739640631-5hYebqotovkg5gtvLFKM03hHryB9arFy-0-68cb08a3f2e54ac77fab27ff704cfbb3)
图1-30 添加项目
勾选“在当前目录中创建quick start项目”,可以创建pages、utils文件夹和app.js、app.json、app.wxss文件,如图1-31所示。不勾选“在当前目录中创建quick start项目”将创建一个空内容项目,如图1-32所示。
![](https://epubservercos.yuewen.com/C1A53A/11261876104972506/epubprivate/OEBPS/Images/figure_0018_0003.jpg?sign=1739640631-qlYL6vi7VGMb1Uem8CDVAmvG8eO5JRex-0-3b254e30742da5a5e717a51f98c02908)
图1-31 勾选“在当前目录中创建quick start项目”的项目
![](https://epubservercos.yuewen.com/C1A53A/11261876104972506/epubprivate/OEBPS/Images/figure_0018_0004.jpg?sign=1739640631-ucjbCl6HCTyG60S7N3H9rAGqtl47QhJe-0-253fa280c311a218c94d0af0fedd52a1)
图1-32 未勾选“在当前目录中创建quick start项目”的项目
单击“添加项目”按钮,第一个微信小程序项目“Hello World”就创建成功了。此时可以看到完整的开发者工具界面,如图1-33所示。
![](https://epubservercos.yuewen.com/C1A53A/11261876104972506/epubprivate/OEBPS/Images/figure_0018_0005.jpg?sign=1739640631-domdQuz7CJb7eUM4iTZ87jTEQIsLE4mS-0-9ec764808bf68d48335e87b7936ec334)
图1-33 开发者工具界面