目录结构(Directory structure)
项目结构
使用cml init project 生成的项目结构如下：
├── chameleon.config.js // 项目的配置文件
├── dist // 打包产出目录
├── mock // 模拟数据目录
├── node_modules // npm包依赖
├── package.json
└── src // 项目源代码
├── app // app启动入口
├── components // 组件文件夹
├── pages // 页面文件夹
├── router.config.json // 路由配置文件
└── store // 全局状态管理
文件夹和文件
| 文件 | 必须 | 作用 |
|---|---|---|
| chameleon.config.js | 必须 | 项目配置文件 |
| dist | 必须 | 自动生成，用户无需关注。项目编译目标目录 |
| mock | 必须 | 数据mock编写文件夹 |
| node_modules | 必须 | 自动生成，用户无需关注。npm包安装文件夹 |
| package.json | 必须 | npm包配置文件 |
| app | 必须 | 应用启动入口根文件夹 |
| components | 必须 | 用户组件根文件夹 |
| pages | 必须 | 页面根文件夹 |
| router.config.json | 必须 | 路由配置文件 |
| store | 必须 | 数据管理文件夹 |
CML 文件
一个CML文件开发的组件由四块内容组成，分别是：
| 标签 | 必须 | 属性 | 作用 |
|---|---|---|---|
| template | 必须 | lang:cml|vue | 提供组件结构、事件绑定、数据绑定、样式绑定 |
| template(标签设置cml-type属性时) | 必须 | cml-type:json | 组件配置 |
| script | 必须 | 暂无 | 组件逻辑 |
| style | 必须 | lang:less|stylus | 组件样式表 |
interface 文件
CML文件的特殊形式，用于实现多态协议规范，多端差异化的入口
| 标签 | 必须 | 属性 | 作用 | 备注 |
|---|---|---|---|---|
| script (interface 定义) | cml-type="interface" 情况下必须和 include 标签二选一 | cml-type:interface | 定义多态协议 | 规定组件或者 API 的输入输出结构和类型 |
| script（实现） |
多态组件：当无标签时（按规定的优先级查找）
多态 API：必须有，或来自 include 继承 |
cml-type:wx|alipay|weex|web|tt|qq|其他
src:${API 方法实现文件引用地址}|${组件实现文件引用地址} |
实现多态协议 |
1. 按<script cml-type="interface" >规定的输入输出结构和类型，实现组件或者 API接口的实现。 2. 有 src 属性时，外链其他文件，且仅多态组件必须通过外链实现。 |
| include | 必须和 <script cml-type="interface" > 的标签二选一 | src:"${引用 interface 文件路径}" | 继承多态协议 |
1. 可用于重载既有组件或 API 的实现，定制化某些端个性化能力。 2. 用于扩展新端。 |