Question

app.json 用于对应用进行全局配置，设置路由、窗口表现、渲染方式等。

以下为默认配置示例：

{
  "routes": [
    {
      "path": "/",
      "source": "pages/Home/index"
    }
  ],
  "window": {
    "defaultTitle": "Rax App 1.0"
  }
}

完整配置项如下：

属性	类型	必填	描述	备注
routes	Array	是	路由配置
hydrate	Boolean	否	渲染内容时是否保留原有 DOM 结构并补充事件绑定，详见	仅对 Web 应用有效
shell	Object	否	设置 PWA AppShell，详见	仅对 Web 应用有效
window	Object	否	设置小程序窗口表现，详见	仅对小程序有效
tabBar	Object	否	设置应用底部 TabBar 的表现。	仅对 Web 应用和小程序有效

routes

routes 用于指定应用的页面，每一项代表对应页面的路径及文件信息。

• path 指定页面对应的匹配路径；

• source 指定页面组件地址（相对于 Rax 工程 src 目录的路径）;

{
  "routes": [                    
    {
      "path": "/",
      "source": "pages/Home"
    },
    {
      "path": "/about",
      "source": "pages/About"
    }
  ]
}

tabBar

如果你的应用是一个多 tab 应用（底部栏可以切换页面），那么可以通过 tabBar 配置项指定 tab 栏的表现，以及 tab 切换时显示的对应页面。

小程序 tabBar 配置可见此文档  。

Web 应用 tabBar 配置和小程序基本相同，但需要注意 Web 应用不支持 pagePath 的设置。 Web 应用使用 path 字段代替 pagePath，其值和 routes 中的 path 配置对应。（小程序也支持 path 设置）

{
  "routes": [
    {
      "path": "/",
      "source": "pages/Home"
    }
  ],
  "tabBar": {
    "textColor": "#999",
    "selectedColor": "#666",
    "backgroundColor": "#f8f8f8",
    "items": [
      {
        "name": "home",
        "path": "/",
        "icon": "https://gw.alicdn.com/tfs/TB1ypSMTcfpK1RjSZFOXXa6nFXa-144-144.png",
        "activeIcon": "https://gw.alicdn.com/tfs/TB1NBiCTgHqK1RjSZFPXXcwapXa-144-144.png"
      }
    ]
  }
}