微信小程序工具如何使用?

　　微信小程序工具如何使用?微信小程序工具的使用方法是每个想要开发微信小程序的第一步，但是微信小程序工具功能很多，并不是每个人都能知道怎么使用?下面小编给大家介绍微信小程序工具如何使用。

　　微信小程序工具如何使用?

　　一、肯定是先去公众号官网下载工具后，安装好打开了，这个很简单，就不在这里详细介绍了。

　　二、创建项目

　　1、微信小程序web开发工具需要扫码登陆，所以必须先绑定开发者才可以

　　2、已经绑定的开发者可以创建项目，需要填写AppID、项目名称、本地开发目录。

　　值得注意的是，小程序AppID需要去设置里边获取，如果不填的话官方给的提示是部分功能受限

　　三、开发工具界面介绍

　　1. 编辑：开发的时候，需要到编辑区去写小程序代码

　　2. 调试：开发完需要调试程序的时候需要切换到这个区域，调试区有很多工具可供使用。

　　3. 项目：在这里可以上传或者预览项目

　　4. 编译：就相当于运行项目的意思

　　5. 关闭：关闭当前工程

　　6. 微信小程序web开发工具提供实时预览的功能，界面的效果会在这个区域显示

　　7. 这个区域可以看到整个项目的文档目录结构

　　8. 这个区域是编码区

　　9. 这里是选择屏幕尺寸的地方

　　10. 模拟网络环境：2G/3G/4G/WiFi

　　四、调试区六大工具介绍

　　在调试区开发工具提供了6种调试模式：

　　1、Console的意思是控制台，做过开发的都知道几乎每个IDE都会有控制台，可以显示错误信息和打印变量的信息等。

　　2、Sources显示了当前项目的所有脚本文件，微信小程序框架会对这些脚本文件进行编译。它下边还有一个区域，做过软件开发的都知道，一般下边是控制台会显示一些log信息、断电调试等等。

　　3、Network顾名思义：这个区域显示的是与网络相关的信息，我这里暂时没有进行网络请求。

　　4、Storage的官方解释是显示当前项目的使用wx.setStorage或者wx.setStorageSync后的数据存储情况。这个后续用到再慢慢研究

　　5、AppData是显示当前项目显示的具体数据，可以在这里编译，并且会在页面实时显示。

　　6、Wxml调试区：把他的名字换一下的话大家就好理解了，其实他的实质就是HTML+CSS，微信只是把HTML改成了Wxml而已。学过HTML的人一看就明白，左侧的区域是HTML语言+CSS的一些标签属*。右侧可以便捷的设置CSS的属*。

　　微信小程序工具使用方法这里只是简单的介绍了一下，实际操作中有些功能是不需要的，所以大家按照自己的需求进行学习哦，当然把这个工具了解透彻会更好。如果大家喜欢我们的微小乔网站，可以添加到收藏哦。

相关推荐：

微信小程序ui设计工具怎么使用？

微信开发者工具全新改版上线，小程序开发发布运维一步到位

小程序工具函数用法详解