十年河东,十年河西,莫欺少年穷

学无止境,精益求精

微信小程序配置文件分为两种,全局配置文件页面配置文件

1、全局配置文件,app.json,详细参考:​ ​

本文主要阐述全局配置文件的 pages、window、tabBar 配置项

pages

用于指定小程序由哪些页面组成,每一项都对应一个页面的 路径(含文件名) 信息。文件名不需要写文件后缀,框架会自动去寻找对应位置的 ​​.json​​, ​​.js​​, ​​.wxml​​, ​​.wxss​​ 四个文件进行处理。

在微信开发工具中有个小窍门可以快速生成页面,如下:

在app.json中输入要新建的页面路径,比如:




"pages/GroupUser/GroupUser"


然后点击 Ctrl+S 微信开发工具就会为开发者生产相关的页面,如下:

微信小程序,全局配置文件_ico

 

app.json 中最上面的一个页面路径为小程序的默认入口页面

2、window 配置项

用于设置小程序的状态栏、导航条、标题、窗口背景色。

window 配置项常用属性如下:



"navigationBarBackgroundColor": "#ccf"


设置导航栏的背景色


微信小程序,全局配置文件_ico_02




"navigationBarTextStyle":"white",


设置导航栏标题颜色,仅支持 ​​black​​ / ​​white​

微信小程序,全局配置文件_配置项_03



"navigationBarTitleText": "陈三毛的小程序",


设置导航栏的标题

微信小程序,全局配置文件_json_04



"enablePullDownRefresh":true,


用于设置下拉刷新



"backgroundTextStyle":"dark"


用于设置下拉刷新的样式

微信小程序,全局配置文件_小程序_05



"backgroundColor": "#ccc",


微信小程序,全局配置文件_ico_06

 

 3、tabBar 配置项

如果小程序是一个多 tab 应用(客户端窗口的底部或顶部有 tab 栏可以切换页面),可以通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页面。

tabBar 配置项用于在小程序底部导航菜单的生成



"tabBar": {
"list": [{
"pagePath": "pages/index/index",
"text": "陈大六",
"iconPath": "/tabBarImg/personal.png",
"selectedIconPath": "/tabBarImg/personal-active.png"
},
{
"pagePath": "pages/demo/demo",
"text": "陈小六",
"iconPath": "/tabBarImg/store.png",
"selectedIconPath": "/tabBarImg/store-active.png"
}
]
},


效果如下:

微信小程序,全局配置文件_json_07

 上述配置中:其中 list 接受一个数组,只能配置最少 2 个、最多 5 个 tab

全局配置项中还有:

networkTimeout

各类网络请求的超时时间,单位均为毫秒。

debug

可以在开发者工具中开启 ​​debug​​ 模式,在开发者工具的控制台面板,调试信息以 ​​info​​ 的形式给出,其信息有 Page 的注册,页面路由,数据更新,事件触发等。可以帮助开发者快速定位一些常见的问题

functionalPages

插件所有者小程序需要设置这一项来启用插件功能页。

subpackages

启用分包加载时,声明项目分包结构。

写成 subPackages 也支持。

workers

基础库 1.9.90 开始支持,低版本需做兼容处理。

使用 Worker 处理多线程任务时,设置 ​​Worker​​ 代码放置的目录

resizable

在 iPad 上运行的小程序可以设置支持屏幕旋转。

在 PC 上运行的小程序,用户可以按照任意比例拖动窗口大小,也可以在小程序菜单中最大化窗口

PermissionObject 结构

微信小程序,全局配置文件_小程序_08



{
"pages": ["pages/index/index"],
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序位置接口的效果展示" // 高速公路行驶持续后台定位
}
}
}


微信小程序,全局配置文件_小程序_09

style

基础库 2.8.0 开始支持,低版本需做兼容处理。

微信客户端 7.0 开始,UI 界面进行了大改版。小程序也进行了基础组件的样式升级。app.json 中配置 ​​"style": "v2"​​可表明启用新版的组件样式。

本次改动涉及的组件有 ​​button icon radio checkbox switch slider​​。可前往小程序示例进行体验

useExtendedLib

基础库 2.2.1 开始支持,低版本需做兼容处理。

最新的 nightly 版开发者工具开始支持,同时基础库从支持 npm 的版本(2.2.1)起支持

指定需要引用的扩展库。目前支持以下项目:

  • ​kbone​​: 多端开发框架
  • ​weui​​: WeUI 组件库

指定后,相当于引入了对应扩展库相关的最新版本的 npm 包,同时也不占用小程序的包体积。rc工具版本支持分包引用。用法如下:



{
"useExtendedLib": {
"kbone": true,
"weui": true
}
}


embeddedAppIdList

指定小程序可通过wx.openEmbeddedMiniProgram打开的小程序名单



{
"embeddedAppIdList": ["wxe5f52902cf4de896"]
}