UNPKG

2.07 kBMarkdownView Raw
1# `|` 基于 Vue.js 的UI组件库
2[![npm version](https://img.shields.io/npm/v/@cgj/k-view.svg?style=flat-square)](https://www.npmjs.org/package/@cgj/k-view)
3[![build status](https://img.shields.io/travis/SoldierAb/k-view/master.svg?style=flat-square)](https://travis-ci.org/SoldierAb/k-view)
4[![install size](https://packagephobia.now.sh/badge?p=@cgj/k-view)](https://packagephobia.now.sh/result?p=@cgj/k-view)
5[![npm downloads](https://img.shields.io/npm/dm/@cgj/k-view.svg?style=flat-square)](http://npm-stat.com/charts.html?package=@cgj/k-view)
6![LICENSE](https://img.shields.io/badge/License-MIT-yellow.svg)
7
8## 安装
9```shell
10 npm i @cgj/k-view -S
11```
12
13## 快速开始
14```javascript
15import KView from '@cgj/k-view'
16import '@cgj/k-view/lib/kview/style.css'
17Vue.use(KView);
18
19// 或
20import {
21 Loading,
22 Tree
23 // ...
24} from '@cgj/k-view'
25
26Vue.use(Loading);
27Vue.use(Tree);
28
29```
30
31## 语言支持
32
33```html
34<template>
35 <k-provider :locale="locale">
36 <router-view />
37 </k-provider>
38</template>
39
40<script>
41 import Vue from "vue"
42 import Provider from "@cgj/k-view/lib/provider"
43 Vue.use(Provider)
44
45 // import zhCN from "@cgj/k-view/lib/locale/lang/zh-CN"; // 默认使用
46 import enUS from "@cgj/k-view/lib/locale/lang/en-US";
47
48 export default{
49 data(){
50 return {
51 locale:enUS
52 }
53 }
54 }
55
56<script>
57
58```
59
60## 按需加载
61通过 [babel-plugin-kimport](https://github.com/SoldierAb/babel-plugin-kimport) 插件的帮助,我们可以按需引入使用的组件以减小打包体积.
62
63首先,安装 [babel-plugin-kimport](https://www.npmjs.com/package/babel-plugin-kimport):
64
65```bash
66
67 npm i -D babel-plugin-kimport
68
69```
70
71修改 babel.config.js 的 plugins 配置项:
72
73```javascript
74
75module.exports = {
76 plugins:[
77 [
78 'kimport',
79 {
80 libraryName: '@cgj/k-view',
81 camel2DashComponentName: true,
82 },
83 'k-view'
84 ],
85 ],
86};
87
88```
89
90## 浏览器支持
91 Internet Explorer 10+ 等现代浏览器
92
93
94## 版本日志
95[release notes](https://github.com/SoldierAb/k-view/releases).
96
97
98## LICENSE
99[MIT](LICENSE)