目录结构

基于 CLI 工具初始化的项目，目录结构如下所示：

.
├── README.md                   # 项目说明
├── build.json                  # 项目构建配置
├── package.json
└── src                         # 源码目录
    ├── app.js                  # 应用入口文件
    ├── app.json                # 应用配置，包括路由配置，小程序 window 配置等
    ├── components              # 应用的公共组件
    │   └── Logo                # 组件
    │       ├── index.css       # Logo 组件的样式文件
    │       └── index.jsx       # Logo 组件 JSX 源码
    ├── document                # 页面的 HTML 模板
    │   └── index.jsx       
    └── pages                   # 页面
        └── Home                # home 页面
            └── index.jsx

pages

`pages` 目录对应应用的具体页面，通过 app.json 中的 routes 配置管理，每个页面导出一个 Rax 组件。

// src/pages/Home/index.jsx
import { createElement, Component } from 'rax';
import View from 'rax-view';

export default class extends Component {
  render() {
    return (
      <View>Hello World</View>
    );
  }
}

components

components 目录存放当前项目级的公共组件，供其他页面或其他组件使用。

document

Document 对应页面的 HTML 模板，使用 jsx 语法来描述，可以将其看做普通的 Rax 组件，具体文档可参考定制 Document。

app.json

app.json 负责应用的运行时相关配置，如 routes、小程序 window 配置等。默认配置方式如下所示：

{
  "routes": [                    // 路由配置
    {
      "path": "/",               // 匹配路径
      "source": "pages/Home"     // 该路径对应的页面组件地址
    }
  ],
  "window": {                    // 小程序 window 配置，仅在小程序中生效
    "defaultTitle": "Rax App 1.0"// 设置 navbar 上的 title
  }
}

更多配置请见 应用配置

build.json

build.json 是整个应用构建相关的配置文件，相关配置可参考工程。