@chase-shao/vue-component-lib/README.md

[](https://github.com/your-username/vue-component-lib)

# Vue Component Library

[![Build Status](https://img.shields.io/badge/build-passing-brightgreen.svg)](https://github.com/your-username/vue-component-lib)

一个现代化的 Vue 3 组件库，使用 Vite 构建，支持 TypeScript 和 `<script setup>` 语法。

## 特性

- 🚀 **Vite 驱动** - 极快的构建速度和开发体验
- ⚡ **Vue 3** - 完全支持 Composition API 和 `<script setup>`
- 📦 **TypeScript** - 完整的类型支持
- 🎨 **CSS 模块化** - 组件样式独立打包
- 📚 **多格式输出** - ES、CJS、UMD 多种格式支持

## 安装

```bash
npm install vue-component-lib
# 或
pnpm add vue-component-lib
# 或
yarn add vue-component-lib
```

## 使用

### 作为 Vue 插件使用

```typescript
import { createApp } from 'vue'
import MyPlugin from 'vue-component-lib'
import 'vue-component-lib/dist/index.css'

const app = createApp({})
app.use(MyPlugin)
```

### 单独导入组件

```typescript
import { MyComponent } from 'vue-component-lib'
import 'vue-component-lib/dist/index.css'
```

## 开发

```bash
# 克隆项目
git clone https://github.com/your-username/vue-component-lib
cd vue-component-lib

# 安装依赖
pnpm install

# 开发模式（监听文件变化）
pnpm dev

# 构建
pnpm build

# 预览构建结果
pnpm preview
```

## 构建输出

- `dist/index.es.js` - ES 模块版本
- `dist/index.cjs.js` - CommonJS 版本
- `dist/index.umd.js` - UMD 版本（浏览器直接使用）
- `dist/index.d.ts` - TypeScript 类型声明
- `dist/index.css` - 组件样式

## 技术栈

- **构建工具**: Vite
- **框架**: Vue 3
- **语言**: TypeScript
- **样式**: CSS with Scoped Styles

## 许可证

MIT License

`npm test` builds the library, then tests it.

## Variations

* [babel](https://github.com/rollup/rollup-starter-lib/tree/babel) — illustrates writing the source code in ES2015 and transpiling it for older environments with [Babel](https://babeljs.io/)
* [buble](https://github.com/rollup/rollup-starter-lib/tree/buble) — similar, but using [Bublé](https://buble.surge.sh/) which is a faster alternative with less configuration
* [TypeScript](https://github.com/rollup/rollup-starter-lib/tree/typescript) — uses [TypeScript](https://www.typescriptlang.org/) for type-safe code and transpiling



## License

[MIT](LICENSE).