Chameleon 目录结构
项目结构
使用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: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. 用于扩展新端。 |