Cview UI


cview-ui 是一套基于 Vue.js 的開源 UI 組件庫,主要服務于 PC 界面的中后臺產品。

安裝

使用npm

npm i cview-ui --save

或使用yarn

yarn add cview-ui --save

main.js中如下配置:

import cview from 'cview-ui'
Vue.use(cview)

或使用cdn全局引入

<link rel="stylesheet" >
<script type="text/javascript" src="http://unpkg.com/cview-ui/dist/cview.min.js"></script>

或按需引用

借助插件babel-plugin-import可以實現按需加載組件,減少文件體積。首先安裝,并在文件.babelrc中配置:

npm install babel-plugin-import --save-dev
// .babelrc
{
    "plugins": [
        ["import", {
                "libraryName": "cview-ui",
                "libraryDirectory": "src/components"
            }
        ]
    ]
}

然后這樣按需引入組件,就可以減小體積了:

import { Button, Table, Divider, Col, Row, ButtonGroup } from 'cview-ui'
Vue.component('CvuButton', Button);
Vue.component('CvuDivider', Divider);
Vue.component('CvuCol', Col);
Vue.component('CvuRow', Row);
Vue.component('CvuButtonGroup', ButtonGroup);
Vue.component('CvuTable', Table);