小程序开发之全局配置app.json

全局配置

小程序根目录下的 app.json 文件用来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。

app.json 配置项列表

例如：

{
  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle":"black"
  },
  "tabBar": {
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页"
      },
      {
        "pagePath": "pages/logs/logs",
        "text": "日志"
      }
    ]
  },
  "networkTimeout": {
    "request": 10000,
    "downloadFile": 10000
  }
}

注：配置文件中不可以写注释,而且标点符号要求很严格，所有符号需要英文符号，配置参数键值最后一个项不能加逗号

pages --页面路径列表

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

{
  "pages": [
	"pages/index/index",
	"pages/logs/logs"
  ]
}

对于的目录为
├── app.js
├── app.json
├── app.wxss
├── pages
│ │── index
│ │ ├── index.wxml
│ │ ├── index.js
│ │ ├── index.json
│ │ └── index.wxss
│ └── logs
│ │├── logs.wxml
│ │├── logs.js
│ │├── logs.json
│ │└── logs.wxss
└── utils

window – 全局的默认窗口表现

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

注：
（1）HexColor（十六进制颜色值），如"#ff00ff"

（2）关于navigationStyle导航栏样式

• 客户端 7.0.0 以下版本，navigationStyle 只在 app.json 中生效。
• 客户端 6.7.2 版本开始，navigationStyle: custom 对 组件无效
• 开启 custom 后，低版本客户端需要做好兼容。开发者工具基础库版本切到 1.7.0（不代表最低版本，只供调试用）可方便切到旧视觉

例如：

"window":{
    "navigationBarBackgroundColor": "#000000",//导航栏背景颜色
    "navigationBarTextStyle":"white",         //导航栏标题颜色，仅支持 black / white
    "navigationBarTitleText": "导航条标题",     //导航栏标题文字内容
    "navigationStyle":"default",              //导航栏样式，default 默认样式 custom 自定义导航栏
    "backgroundColor":"grey",                 //窗口的背景色，如设置下拉顶部窗口颜色将覆盖背景色
    "enablePullDownRefresh":true,		      //是否开启当前页面的下拉刷新
    "backgroundTextStyle":"dark",             //下拉 loading 的样式，仅支持 dark / light
    "backgroundColorTop":"grey",              //顶部窗口的背景色，仅 iOS 支持
    "onReachBottomDistance":50,               //页面上拉触底事件触发时距页面底部距离，单位为px。
    "backgroundColorBottom": "green",         //底部窗口的背景色，仅 iOS 支持
    "pageOrientation":"auto"                  //屏幕旋转设置，仅支持 auto / portrait
  },

tabBar 底部导航栏

如果小程序是一个多 tab 应用（客户端窗口的底部或顶部有 tab 栏可以切换页面），可以通过 tabBar 配置项指定 tab 栏的表现，以及 tab 切换时显示的对应页面。
其中 list 接受一个数组，只能配置最少2个、最多5个 tab。tab 按数组的顺序排序，每个项都是一个对象，其属性值如下：

底部导航栏例如

"tabBar": {
    "color":"green",              //tab 上的文字默认颜色，仅支持十六进制颜色
    "selectedColor":"red",        //tab 上的文字选中时的颜色，仅支持十六进制颜色
    "backgroundColor":"lightgrey",//tab 的背景色，仅支持十六进制颜色
    "borderStyle":"black",        //tabbar上边框的颜色， 仅支持 black / white
    "position":"bottom",          //tabBar的位置，仅支持 bottom / top
    "list": [                     //tab 的列表，详见 list 属性说明，最少2个、最多5个 tab
      {
        "pagePath": "pages/index/index",             //页面路径，必须在 pages 中先定义
        "text": "首页",                               //tab 上按钮文字
        "iconPath":"Assets/images/index.png",        //图片路径，限制为40kb，建议尺寸为 81px * 81px
        "selectedIconPath":"Assets/images/index.png" //选中后的图片路径 
      },
      {
        "pagePath": "pages/logs/logs",
        "text": "日志",
        "iconPath": "Assets/images/log.png",
        "selectedIconPath": "Assets/images/log.png"
      }
    ]
  },

如果
"position":"top"

networkTimeout – 网络超时时间

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

例如

"networkTimeout": {
    "request": 20000,          //wx.request 的超时时间，单位：毫秒。
    "connectSocket":20000,     //wx.connectSocket 的超时时间，单位：毫秒。
    "uploadFile":20000,        //wx.uploadFile 的超时时间，单位：毫秒。 
    "downloadFile": 20000      //wx.downloadFile 的超时时间，单位：毫秒。
  }

当超过请求时间，将走fail:funtion()方法

debug – debug 模式

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

functionalPages – 是否启用插件功能页，默认关闭

启用插件功能页时，插件所有者小程序需要设置其 functionalPages 为 true。
例如
"functionalPages": true

subpackages – 分包结构配置

启用分包加载时，声明项目分包结构。
分包加载
某些情况下，开发者需要将小程序划分成不同的子包，在构建时打包成不同的分包，用户在使用时按需进行加载。
后面会单独介绍

workers – Worker 代码放置的目录(多线程)

使用 Worker 处理多线程任务时，设置 Worker 代码放置的目录
后面会单独介绍

requiredBackgroundModes – 需要在后台使用的能力，如「音乐播放」

申明需要后台运行的能力，类型为数组。目前支持以下项目：
audio: 后台音乐播放
例如

"requiredBackgroundModes": [
    "audio"
  ]

注：在此处申明了后台运行的接口，开发版和体验版上可以直接生效，正式版还需通过审核。

plugins – 使用到的插件

声明小程序需要使用的插件。后面会单独介绍
备注：插件地址：https://developers.weixin.qq.com/community/plugins
例如

"plugins": {
      "myPlugin": {
        "version": "1.0.0",
        "provider": "wxidxxxxxxxxxxxxxxxx"
      }
  }

注：plugins 定义段中可以包含多个插件声明，每个插件声明以一个使用者自定义的插件引用名作为标识，并指明插件的 appid 和需要使用的版本号。其中，引用名（如上例中的 myPlugin）由使用者自定义，无需和插件开发者保持一致或与开发者协调。在后续的插件使用中，该引用名将被用于表示该插件。

preloadRule – 分包预下载规则

声明分包预下载的规则。
后面会单独介绍

resizable – iPad 小程序是否支持屏幕旋转，默认关闭

在 iPad 上运行的小程序可以设置支持屏幕旋转。
例如
"resizable":true

navigateToMiniProgramAppIdList – 需要跳转的小程序列表

当小程序需要使用 wx.navigateToMiniProgram 接口跳转到其他小程序时，需要先在配置文件中声明需要跳转的小程序 appId 列表，最多允许填写 10 个。
后面会单独介绍
例如

"navigateToMiniProgramAppIdList": [
    "wx3efb95b9c5579418",
    "wxc1039e003593f9b4",
    "wxc75cac912af33647",
    "wx88bbae21474301ed",
    "wxd101b6b8f64db085",
    "wxd7c5b7d77ff1b238",
    "wxefe8997276c7a7d4",
    "wxbdfee33ea394a980",
    "wx8b3a98563fc40251"
  ]

usingComponents – 全局自定义组件配置

在此处声明的自定义组件视为全局自定义组件，在小程序内的页面或自定义组件中可以直接使用而无需再声明。
后面会单独介绍
例如：
"usingComponents": {}

permission – 小程序接口权限相关设置

小程序接口权限相关设置。字段类型为 Object，结构为：

PermissionObject 结构

例如

"permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于小程序位置接口的效果展示"
    }
  }

注：官方通告