使用cml init project 生成的項目結構如下:
├── chameleon.config.js // 項目的配置文件
├── dist // 打包產(chǎn)出目錄
├── mock // 模擬數(shù)據(jù)目錄
├── node_modules // npm包依賴
├── package.json
└── src // 項目源代碼
├── app // app啟動入口
├── components // 組件文件夾
├── pages // 頁面文件夾
├── router.config.json // 路由配置文件
└── store // 全局狀態(tài)管理
文件 | 必須 | 作用 |
---|---|---|
chameleon.config.js | 必須 | 項目配置文件 |
dist | 必須 | 自動生成,用戶無需關注。項目編譯目標目錄 |
mock | 必須 | 數(shù)據(jù)mock編寫文件夾 |
node_modules | 必須 | 自動生成,用戶無需關注。npm包安裝文件夾 |
package.json | 必須 | npm包配置文件 |
app | 必須 | 應用啟動入口根文件夾 |
components | 必須 | 用戶組件根文件夾 |
pages | 必須 | 頁面根文件夾 |
router.config.json | 必須 | 路由配置文件 |
store | 必須 | 數(shù)據(jù)管理文件夾 |
一個 .cml 文件開發(fā)的組件由四塊內容組成,分別是:
標簽 | 必須 | 屬性 | 作用 |
---|---|---|---|
template | 必須 | lang:vue | 提供組件結構、事件綁定、數(shù)據(jù)綁定、樣式綁定 |
template(標簽設置cml-type屬性時) | 必須 | cml-type:json | 組件配置 |
script | 必須 | 暫無 | 組件邏輯 |
style | 必須 | lang:less|stylus | 組件樣式表 |
.cml 文件的特殊形式,用于實現(xiàn)多態(tài)協(xié)議規(guī)范,多端差異化的入口
標簽 | 必須 | 屬性 | 作用 | 備注 |
---|---|---|---|---|
script (interface 定義) | cml-type="interface" 情況下必須和 include 標簽二選一 | cml-type:interface | 定義多態(tài)協(xié)議 | 規(guī)定組件或者 API 的輸入輸出結構和類型 |
script(實現(xiàn)) | 多態(tài)組件:當無標簽時按規(guī)定的優(yōu)先級查找 多態(tài) API:必須有,或來自 include 繼承 | cml-type:wx|alipay|weex|web|tt|qq|其他 src:API 方法實現(xiàn)文件引用地址|組件實現(xiàn)文件引用地址 | 實現(xiàn)多態(tài)協(xié)議 | 1. 按<script cml-type="interface" >規(guī)定的輸入輸出結構和類型,實現(xiàn)組件或者 API接口的實現(xiàn)。 2. 有 src 屬性時,外鏈其他文件,且僅多態(tài)組件必須通過外鏈實現(xiàn)。 |
include | 必須和 <script cml-type="interface" > 的標簽二選一 | src:引用 interface 文件路徑 | 繼承多態(tài)協(xié)議 | 1. 可用于重載既有組件或 API 的實現(xiàn),定制化某些端個性化能力。 2. 用于擴展新端。 |
更多建議: