主要組件和模塊
style
構建項目后添加了reset.css、base.css ；就是從項目搭建之初處理一些常見問題以及規范；其中的 base.css對1px顯示問題的處理，該UI的的極致體驗可見一斑。
create api
其作用是把把聲明式的組件改為API方式的調用，可是Vue推薦的不就是聲明式調用組件嗎，聲明式調用只需要在調用該組件的地方簡單聲明即可，如下：
<template>
XXXX
</template>
是不是非常簡單，那create API是干啥用的呢？其實他主要的應用場景是全屏類的彈框組件：
如果在一個層級嵌套很深的子組件中使用，仍然通過聲明式的方式，很可能它的樣式會受到父元素某些 CSS 的影響導致渲染不符合預期。這類組件最好的使用方式就是掛載到 body 下，但是我們如果是聲明式地把這些組件掛載到最外層，對它們的控制也非常不靈活。其實最理想的方式是動態把這類組件掛載到 body 下，createAPI 就是干這個事情的。
eg:
1:開發一個自定義的彈框組件
<template>
<div class="my-dialog-view">
<cube-popup ref="popup" @mask-click="hide">
<div class="subscribe-dialog-wrapper">
<span class="close" @click="hide"><i class="cubeic-close"></i></span>
<div class="title">啊哈哈哈哈</div>
some Word for test
<cube-button class="button">OK</cube-button>
</div>
</cube-popup>
</div>
</template>
<script>
export default {
name: 'my-dialog',
methods: {
show () {
this.$refs.popup.show()
this.$emit('show')
},
hide () {
this.$refs.popup.hide()
this.$emit('hide')
}
// ...
}
}
</script>
2:接着使用 createAPI 模塊把它變成一個 API 式的組件：
import MyDialog from './components/subscribe-dialog/my-dialog' createAPI(Vue, mybeDialog, [], true)
3:然后你就可以調用這個組件了
this.$createSubscribeDialog({
}).show()
create API 也是可以將已有的cube 中的組件變成API方式的調用，實現方法和上面基本一致，只是不需要你自己在開發vue文件了。
better-scroll
處理三方插件
后編譯
eg:
1:cube-UI利用后編譯實現自定義主題
- 在src目錄下創建 them.style 文件
- 修改webpack中關於stylus-loader的配置項目
項目演示
我創建了一個vue的項目，啟動項目如下圖所示
我們想要把其中按鈕的背景顏色換掉我們要怎么實現呢
這時候我們來想一下如果我們用的是element-UI 我們要怎么實現這個效果呢？我們要重寫這個按鈕的樣式，但是這樣有兩個問題：1、容易造成代碼污染，有可能導致其他的按鈕樣式發生變化；2、造成代碼冗余。當然還有其他的框架是支持重寫重新定義主題的，但是這樣也會造成代碼冗余。
如果我們用的是cube-ui只需要在them.style 文件中進行修改即可
例如
// button
//$btn-bgc := $color-regular-blue
//$btn-active-bgc := $color-blue
$btn-bgc := #409eff
$btn-active-bgc := #66b1ff
是不是非常簡單。