【微信小程序】微信开发者工具的使用

时间:2022-08-31 17:47:04

微信开发者工作是微信官方提供的针对微信小程序的开发工具,集中了开发,调试,预览,上传等功能。下面来介绍下自己的针对小程序和微信开发者工具的使用心得。

下载地址:开发者工具下载地址

1.下载并安装以后打开,需使用微信号扫码登录开发者工具

【微信小程序】微信开发者工具的使用登陆新建一个quick start项目

【微信小程序】微信开发者工具的使用

如果还没有注册,可以填写无AppID,它会显示部分功能受限,实际上并没有太大影响。

2.添加一个quick start项目

【微信小程序】微信开发者工具的使用【微信小程序】微信开发者工具的使用【微信小程序】微信开发者工具的使用

3.目录结构

从上图的右侧可以很清晰地看出来一个微信小程序的结构,一个微信小程序的页面包括四个文件:

a.“.js”后缀的是脚本文件,主要是写一些业务逻辑的代码,基本和JavaScript一样。(在开发过程中发现一些函数JS有而微信没有,毕竟这是微信自己的一套东西)。

b.“.json”后缀的是配置文件,例如tab的各种属性,实际中每个小页面的使用的并不多,涉及全局配置的app.json使用比较多,app.json中包括定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。

c.“.wxml”后缀的是前端显示页面文件,你也可以把它理解为html页面,规则也和html5很类似,还是那句话,并不是完全一样,有些H5实现的东西wxml并不能实现。

d.“wxss”后缀的是样式表文件,类似于css。

以上是每个微信小程序页面的四种基本构成,微信开发者工具会根据这些,编译生成相应的小程序实例。