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" href="//unpkg.com/cview-ui/dist/cview.min.css">
<script type="text/javascript" src="//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);