Chameleon 目錄結構

2020-05-14 14:19 更新

項目結構

使用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 文件

一個 .cml 文件開發(fā)的組件由四塊內容組成,分別是:

標簽必須屬性作用
template必須lang:vue提供組件結構、事件綁定、數(shù)據(jù)綁定、樣式綁定
template(標簽設置cml-type屬性時)必須cml-type:json組件配置
script必須暫無組件邏輯
style必須lang:less|stylus組件樣式表

.interface 文件

.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. 用于擴展新端。


以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號