微信小程序开发简介(二)
小程序开发
浏览:1138 次

出身背景
在上一篇文章中,我们已经开始了小程序的开发,申请了小程序序列号,并准备了开发环境。今天,我们来分析一下小程序的项目结构。
项目结构
小程序的项目结构如下图所示。小程序项目主要包括四种类型的文件:
带有的JSON配置文件。json后缀
具有的WXML模板文件。wxml后缀
具有的WXSS样式文件。wxss后缀
JS脚本逻辑文件。js后缀
配置文件
小程序项目包含许多配置文件,用于从不同级别配置某些属性。
app.json
app。Json是当前小程序的全局配置,包括所有页面路径、界面表示、网络超时、底部选项卡等。下表显示了在app的所有27个配置项之前创建的测试项的app。json json如下。对于初学者来说,您不能过分关注每个配置项,否则您可能会迷失在配置的海洋中。同时,您可以看到,只有两个必要的配置项,其中许多项特定于特定场景。所以现在你只需要对app有另一种感性的理解。json,其中包括小程序的全局配置。
属性
类型
要求的
描述
入口页面路径
一串
不
小程序的默认启动主页
页
字符串[]
对
页面路径列表
窗
对象
不
全局默认窗口表示
选项卡栏
对象
不
底部选项卡的性能
网络超时
对象
不
网络超时
调试
布尔值
不
是否启用默认关闭的调试模式
功能页面
布尔值
不
启用插件功能页,默认关闭
子包装
对象[]
不
分包结构配置
工人
一串
不
放置工作代码的目录
所需背景模式

字符串[]
不
能够在后台使用,如音乐播放
插件
对象
不
使用的插件
预加载规则
对象
不
分包预下载规则
可调整大小
布尔值
不
PC小程序是否支持用户随意更改窗口大小(包括最大化窗口);iPad小程序是否支持屏幕旋转。默认情况下关闭
使用组件
对象
不
全局自定义组件
准许
对象
不
与小程序界面权限相关的设置
站点地图位置
一串
对
指明json的站点地图位置
风格
一串
不
指定使用升级的weui样式
使用扩展库
对象
不
指定要引用的扩展库
入口声明
对象
不
使用小程序打开微信消息
暗模式
布尔值
不
小程序支持DarkMode
主题位置
一串
不
指明主题json的位置。如果暗模式为真,则需要
lazyCode加载
一串
不
配置自定义组件代码按需注入
单页
对象

不
与单页模式相关的配置
服务提供商票证
一串
不
定制服务提供商账单
嵌入式应用ID列表
字符串[]
不
半屏小程序appId
半页
对象
不
视频号直播半屏场景设置
调试选项
对象
不
调试相关配置
以下显示了app的内容。json,其中包含必要的配置项。
{
“页面”:[
“页面/索引/索引”,
“页面/日志/日志”
],
“窗口”:{
“backgroundTextStyle”:“浅”,
“navigationBarBackgroundColor”:“#fff”,
“navigationBarTitleText”:“Weixin”,
“navigationBarTextStyle”:“黑色”
},
“style”:“v2”,
“站点地图位置”:“站点地图.json”
}
页面字段用于描述当前小程序的所有页面路径。微信小程序通常包含多个页面。页面放在pages目录中,每个页面可能需要在json的pages字段下的app Register中,否则跳转时将找不到页面。文件名不需要有文件后缀。框架将自动找到相应的。json等,。js、,。wxml和。wxss文件进行处理。例如,我们的测试项目的目录结构如下,包括两个页面,索引和日志。
├── app.js
├── app.json
├── app.wxss
├── 页
│ │── 指数
│ │ ├── 索引.wxml
│ │ ├── 索引.js
│ │ ├── 索引.json
│ │ └── 索引.wxss
│ └── 日志
│ ├── 日志.wxml
│ └── 日志.js
└── 实用程序
因此,我们项目的app页面。json的配置如下
“页面”:[
“页面/索引/索引”,
“页面/日志/日志”
]
同时,通过entryPagePath配置项配置小程序的启动页面。如果未配置,默认页面中的第一项是启动页面。

窗口字段定义小程序所有页面的顶部背景色、文本颜色定义等。其具体特性如下表所示。
同时,每个页面也有自己的页面配置文件,如索引。json配置页面。如果配置内容与