# cil-ui

**Repository Path**: cellinlab/cil-ui

## Basic Information

- **Project Name**: cil-ui
- **Description**: Cil UI 是一款基于 Vue 3 和 TypeScript 的 UI 组件库。

本组件库建设目的是了解和学习 Vue 3 和 TypeScript，以及其在组件库生产实践中的应用。
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: https://cellinlab.gitee.io/cil-ui-website
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2021-03-09
- **Last Updated**: 2022-07-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Cil UI
## 介绍

Cil UI 是一款基于 Vue 3 和 TypeScript 的 UI 组件库。

本组件库建设目的是了解和学习 Vue 3 和 TypeScript，以及其在组件库生产实践中的应用实践。

本组件库会收集借鉴一些经典 UI 库中组件进行基础实现，以提高对组件使用及设计的理解。如果有兴趣，可以关注 [https://gitee.com/cellinlab/cil-ui](https://gitee.com/cellinlab/cil-ui)

不建议将此 UI 库用于生产环境。

## 安装

打开终端运行下列命令：

```
npm install cil-ui
```

或

```
yarn add cil-ui
```

## 开始使用
完成组件库安装后，在你的代码中写入下面的代码

```
import { Button, Tabs, Switch, Dialog, openDialog } from "cil-ui"
```

就可以使用本 UI 库提供的组件了。

### Vue 单文件组件

代码示例：

``` html
<template>
  <div>
    <Button>按钮</Button>
  </div>
</template>
<script>
import { Button, Tabs, Switch, Dialog, openDialog } from "cil-ui"
export default {
  components: {Button}
}
</script>
```