字节跳动小程序开发框架全局配置

app.json是一个用来对头条小程序进行全局配置的文件，用来配置页面的路径，窗口样式表现等。

app.json的配置选项如下：

{
  "pages": [
    "pages/index/index",
    "pages/logs/index"
  ],
  "window": {
    "navigationBarTitleText": "Demo"
  },
  "tabBar": {
    "list": [{
      "pagePath": "pages/index/index",
      "text": "首页"
    }, {
      "pagePath": "pages/logs/logs",
      "text": "日志"
    }]
  }
}

配置项说明

---

属性	类型	必填	描述	最低版本
pages	String Array	是	配置页面路径
window	Object	否	配置默认页面的窗口表现
tabBar	Object	否	配置底部 tab 的表现
navigateToMiniProgramAppIdList	Array	否	需要跳转的小程序列表，相关api见tt.navigateToMiniProgram	1.15.0

pages

这个字段用于配置小程序用到的所有页面路径，配置每项是 路径 + 文件名 这个结构。配置项的第一个页面路径就是小程序启动展示的第一个页面。

需要注意：保证单个页面的.json, .js, .ttml, .ttss资源都放在每个页面路径的首层

如开发目录如下：

|____app.ttss
|____app.json
|____project.config.json
|____pages
|       |____index
|       |        |____index.js
|       |        |____index.json
|       |        |____index.ttml
|       |        |____index.ttss
|____app.js

那么app.json应该这样配置：

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

window

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

属性	类型	默认值	描述
navigationBarBackgroundColor	HexColor	#000000	导航栏背景颜色，如"#000000"
navigationBarTextStyle	String	white	导航栏标题颜色，仅支持 black/white
navigationBarTitleText	String		导航栏标题文字内容
navigationStyle	String	default	导航栏样式，仅支持 default/custom。custom 模式可自定义导航栏，只保留右上角胶囊状的按钮
backgroundColor	HexColor	#ffffff	窗口的背景色
backgroundTextStyle	String	dark	下拉 loading 的样式，仅支持 dark/light
backgroundColorTop	String	#ffffff	顶部窗口的背景色，仅 iOS 支持
backgroundColorBottom	String	#ffffff	底部窗口的背景色，仅 iOS 支持
enablePullDownRefresh	Boolean	false	是否开启下拉刷新，详见页面相关事件处理函数
onReachBottomDistance	Number	50	页面上拉触底事件触发时距页面底部距离，单位为px

tabBar

如果你的小程序包含多个tab（客户端窗口的底部或顶部有 tab 栏可以切换页面），可以通过 tabBar 配置项指定 tab 栏的表现，以及 tab 切换时显示的对应页面。比如设置tab展示标题和tab颜色等。

属性	类型	必填	默认值	描述
color	HexColor	是		tab 上的文字默认颜色
selectedColor	HexColor	是		tab 上的文字选中时的颜色
backgroundColor	HexColor	是		tab 的背景色
borderStyle	String	否	black	tabbar上边框的颜色， 仅支持 black/white
list	Array	是		tab 的列表，详见 list 属性说明，最少2个、最多5个 tab

其中 list 接受一个数组，数组中的每个项都是一个对象，其属性值如下：

属性	类型	必填	描述
pagePath	String	是	页面路径，必须在 pages 中先定义
text	String	是	tab 上按钮文字
iconPath	String	否	图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px，当 postion 为 top 时，此参数无效，不支持网络图片
selectedIconPath	String	否	选中时的图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px ，当 postion 为 top 时，此参数无效

navigateToMiniProgramAppIdList

当小程序需要使用tt.navigateToMiniProgram接口跳转到其他小程序时，需要先在配置文件中声明需要跳转的小程序appId列表，最多允许填写 10 个。

page.json

---

头条小程序的每一个页面的窗口表现也可以通过页面目录下的.json文件进行配置，这个页面的独立配置会比 app.json 要简单；

如果 app.json 的 window 字段里面配置了某个页面的窗口样式，同时该页面也在自己的 .json文件中做了对应字段的配置的话，框架会优先采用页面里面的 .json 相应配置项。

具体的配置字段如下：

属性	类型	默认值	描述
navigationBarBackgroundColor	HexColor	#000000	导航栏背景颜色，如"#000000"
navigationBarTextStyle	String	white	导航栏标题颜色，仅支持 black/white
navigationBarTitleText	String		导航栏标题文字内容
navigationStyle	String	default	导航栏样式，仅支持 default/custom。custom 模式可自定义导航栏，只保留右上角胶囊状的按钮
backgroundColor	HexColor	#ffffff	窗口的背景色
backgroundTextStyle	String	dark	下拉 loading 的样式，仅支持 dark/light
enablePullDownRefresh	Boolean	false	是否开启下拉刷新，详见页面相关事件处理函数。
disableScroll	Boolean	false	设置为 true 则页面整体不能上下滚动；只在 page.json 中有效，无法在 app.json 中设置该项
disableSwipeBack	Boolean	false	禁止页面右滑手势返回
onReachBottomDistance	Number	50	页面上拉触底事件触发时距页面底部距离，单位为px
usingComponents	Object		自定义组件配置

例子：

{
  "navigationBarBackgroundColor": "#ffffff",
  "navigationBarTextStyle": "black",
  "navigationBarTitleText": "头条接口功能演示",
  "backgroundColor": "#eeeeee",
  "backgroundTextStyle": "light"
}