soft-ui-vue3/README.md

一个Vue3前端组件库

# SoftUI

一个Vue3前端组件库

## 在线文档
[https://sunhy-cn.gitee.io/soft-ui](!https://sunhy-cn.gitee.io/soft-ui)

（可能会出现更新滞后）

## 通过Npm包引入

### 安装
```sh
# Choose a package manager you like.

# NPM
$ npm install soft-ui-vue3 --save

# Yarn
$ yarn add soft-ui-vue3

# pnpm
$ pnpm install soft-ui-vue3
```

### 引入项目
```js
// in main.js
import { createApp } from 'vue'
import SoftUI from 'soft-ui-vue3'
import 'soft-ui-vue3/lib/style.css'
import App from './App.vue'

const app = createApp(App)
app.use(SoftUI)

app.mount('#app')
```

## 源码本地打包构建

> gitee地址：[sunhy/soft-ui](https://gitee.com/sunhy-cn/soft-ui)

1、获取仓库代码地址：https://gitee.com/sunhy-cn/soft-ui.git；  

2、下载至本地：

```shell
git clone https://gitee.com/sunhy-cn/soft-ui.git
```

3、安装依赖：

```shell
pnpm install
```

4、打包构建：
```
npm run lib
```

5、将构建出的lib文件内容复制到项目中直接引用，包括：
  
  - lib/global.d.ts // volar类型支持
  - lib/soft-ui.umd.js
  - lib/style.css

6、在main.ts文件中导入上述文件，或直接在项目index.html中使用标签`style`和`script`引入

## TypeScript类型支持

如果您使用 Volar，请在`tsconfig.json`中通过`compilerOptions.type`指定全局组件类型。
```json
// in tsconfig.json
{
  "compilerOptions": {
    // ...
    "types": ["soft-ui-vue3/lib/global"]
  }
}
```