微信小程序培训笔记2-开发第一个微信小程序

原创

zhaoxuhua12 2021-11-06 10:26:17 博主文章分类：微信小程序培训笔记 ©著作权

文章标签 推送开发者工具小程序版本管理调试器 文章分类 微信开发移动开发

©著作权归作者所有：来自51CTO博客作者zhaoxuhua12的原创作品，请联系作者获取转载授权，否则将追究法律责任

第⼀个微信⼩程序Hello World

1. 打开微信开发者⼯具

注意第⼀次登录的时候需要扫码登录

2. 新建小程序项目

3. 填写项⽬信息

新建项目，输入项目名称，选择AppID(可以使用正式的AppID或者测试AppID，后面随时可以改），选择开发模式（小程序），就可以默认就会新建生成一个Hello World小程序。

4.小程序结构

⼩程序框架提供了⾃⼰的视图层描述语⾔ WXML 和 WXSS ，以及 JavaScript ，并在视图层与逻辑层间提供了数据传输和事件系统，让开发者能够专注于数据与逻辑。

4.1 ⼩程序⽂件结构和传统web对⽐

通过以上对⽐得出，传统web 是三层结构。⽽微信⼩程序是四层结构，多了⼀层配置置.json

4.2 基本的项⽬⽬录

4.3 ⼩程序配置⽂件

⼀个⼩程序应⽤程序会包括最基本的两种配置⽂件。⼀种是全局的 app.json 和⻚⾯⾃⼰的page.json 注意：配置文件中不能出现注释

4.3.1 全局配置app.json

app.json 是当前⼩程序的全局配置，包括了⼩程序的所有⻚⾯路径、界⾯表现、⽹络超时时间、底部 tab 等。普通快速启动项⽬⾥边的 app.json 配置字段的含义 1）pages 字段⸺⽤于描述当前⼩程序所有⻚⾯路径，这是为了让微信客⼾端知道当前你的⼩程序⻚⾯定义在哪个⽬录。 2）window 字段⸺定义⼩程序所有⻚⾯的顶部背景颜⾊，⽂字颜⾊定义等。 3）完整的配置信息请参考官网app.json配置

4.3.1.1 tabbar

4.3.2 ⻚⾯配置page.json

这⾥的 page.json 其实⽤来表⽰⻚⾯⽬录下的 page.json 这类和⼩程序⻚⾯相关的配置。开发者可以独⽴定义每个⻚⾯的⼀些属性，如顶部颜⾊、是否允许下拉刷新等等。⻚⾯的配置只能设置 app.json 中部分 window 配置项的内容，⻚⾯中配置项会覆盖 app.json的 window 中相同的配置项。