小程序根目录下的 app.json 文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。
JOSN文件不允许注释,下面为了学习加上注释,粘贴需要的片段去掉注释即可。小程序定义color建议使用16进制颜色
1. pages定义页面路径列表
"pages": [ "pages/news/news", "pages/index/index", "pages/movie/movie", "pages/logs/logs" ], |
2. window 用于设置小程序的状态栏、导航条、标题、窗口背景色
"window": { "backgroundTextStyle": "light", // 下拉 loading 的样式,仅支持 dark / light "navigationBarBackgroundColor": "white", // 导航栏背景颜色 "navigationBarTitleText": "哈哈", // 导航栏标题内容 "navigationBarTextStyle": "black", // 导航栏标题颜色 black / white "navigationStyle": "custom", // 导航栏样式 默认为default custom 表示自定义导航栏,只保留右上角 "backgroundColor":"#ffffff" // 窗口的背景颜色 }, |
3. tabBar
如果小程序是一个多 tab 应用(客户端窗口的底部或顶部有 tab 栏可以切换页面),可以通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页面。
"tabBar": { "color": "#000", // 文字默认颜色 "borderStyle": "black", // tabBar上边框的颜色 仅支持 black / white "selectedColor": "#ff6600", // tab 上的文字选中时的颜色 "position":"bottom", // 位置 top | bottom, "custom": "false", // 自定义tabBar 默认false "list": [ // tab列表 { "pagePath": "pages/news/news", // 页面路径 "text": "新闻", // tab 上按钮文字 "iconPath": "pages/images/yuedu.png", // 图片路径,icon 大小限制为 40kb,建议尺寸为 81px * 81px,不支持网络图片。 当 position 为 top 时,不显示 icon。 "selectedIconPath": "pages/images/193.jpg" // 选中时的图片路径,icon 大小限制为 40kb,建议尺寸为 81px * 81px,不支持网络图片。 当 position 为 top 时,不显示 icon。 }, { "pagePath": "pages/movie/movie", "text": "电影", "iconPath": "pages/images/diany.png", "selectedIconPath": "pages/images/506.jpg" } ] }, |
4. networkTimeout
各类网络请求的超时时间,单位均为毫秒 默认值60000
"networkTimeout": { "request": 10000, // wx.request 的超时时间 "downloadFile": 10000, // wx.downloadFile 的超时时间 "connectSocket": 10000, // wx.connectSocket 的超时时间 "uploadFile": 10000 // wx.uploadFile 的超时时间 }, |
5. debug
可以在开发者工具中开启 debug 模式
"debug": true, |
6. requiredBackgroundModes
申明需要后台运行的能力,类型为数组 目前支持audio后台音乐播放 / location 后台定位
"requiredBackgroundModes": ["audio", "location"], |
7. permission
小程序接口权限相关设置。字段类型为 Object
"permission": { "scope.userLocation": { // 位置相关权限声明 "desc": "你的位置信息将用于小程序位置接口的效果展示" // 高速公路行驶持续后台定位 } }, |
8. style
微信小程序基础组件样式升级
"style": "v2",
完整app.json文件
{ "pages": [ "pages/news/news", "pages/index/index", "pages/movie/movie", "pages/logs/logs" ], "window": { "backgroundTextStyle": "light", "navigationBarBackgroundColor": "white", "navigationBarTitleText": "哈哈", "navigationBarTextStyle": "black", "navigationStyle": "custom", "backgroundColor": "#ffffff" }, "tabBar": { "color": "#000", "borderStyle": "black", "selectedColor": "#ff6600", "position": "bottom", "custom": "false", "list": [ { "pagePath": "pages/news/news", "text": "新闻", "iconPath": "pages/images/yuedu.png", "selectedIconPath": "pages/images/193.jpg" }, { "pagePath": "pages/movie/movie", "text": "电影", "iconPath": "pages/images/diany.png", "selectedIconPath": "pages/images/506.jpg" } ] }, "networkTimeout": { "request": 6000, "downloadFile": 60000, "connectSocket": 60000 , "uploadFile": 60000 }, "debug": true, "requiredBackgroundModes": [ "audio", "location" ], "permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" } }, "style": "v2" } |