@breezeui/vue 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +115 -0
- package/dist/index.cjs +88 -0
- package/dist/index.css +1 -0
- package/dist/index.d.ts +2618 -0
- package/dist/index.js +10856 -0
- package/package.json +66 -0
package/README.md
ADDED
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
# BreezeUI
|
|
2
|
+
|
|
3
|
+
<p align="center">
|
|
4
|
+
<img src="https://via.placeholder.com/200x200.png?text=BreezeUI+Logo" alt="BreezeUI Logo" width="200"/>
|
|
5
|
+
</p>
|
|
6
|
+
|
|
7
|
+
<p align="center">
|
|
8
|
+
轻量、可定制、基于 TailwindCSS 的 Vue 3 组件库
|
|
9
|
+
</p>
|
|
10
|
+
|
|
11
|
+
<p align="center">
|
|
12
|
+
<a href="https://www.npmjs.com/package/@breezeui/vue">
|
|
13
|
+
<img src="https://img.shields.io/npm/v/@breezeui/vue.svg" alt="npm version">
|
|
14
|
+
</a>
|
|
15
|
+
<a href="https://github.com/breezeui-vue/breezeui/blob/main/LICENSE">
|
|
16
|
+
<img src="https://img.shields.io/npm/l/@breezeui/vue.svg" alt="license">
|
|
17
|
+
</a>
|
|
18
|
+
</p>
|
|
19
|
+
|
|
20
|
+
## ✨ 特性
|
|
21
|
+
|
|
22
|
+
- ⚡️ **轻量级**: 专为性能打造,体积小巧。
|
|
23
|
+
- 🎨 **TailwindCSS**: 基于 TailwindCSS 构建,完全可定制。
|
|
24
|
+
- 🔧 **TypeScript**: 全量 TypeScript 编写,提供优秀的类型推导。
|
|
25
|
+
- 🧩 **Vue 3**: 拥抱 Vue 3 Composition API。
|
|
26
|
+
- 🌲 **按需引入**: 支持 Tree Shaking,只打包你用到的代码。
|
|
27
|
+
|
|
28
|
+
## 📦 安装
|
|
29
|
+
|
|
30
|
+
推荐使用 `pnpm` 进行安装:
|
|
31
|
+
|
|
32
|
+
```bash
|
|
33
|
+
pnpm add @breezeui/vue
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
或者使用 yarn / npm:
|
|
37
|
+
|
|
38
|
+
```bash
|
|
39
|
+
yarn add @breezeui/vue
|
|
40
|
+
# or
|
|
41
|
+
npm install @breezeui/vue
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## 🚀 快速上手
|
|
45
|
+
|
|
46
|
+
### 全局引入
|
|
47
|
+
|
|
48
|
+
在你的 `main.ts` 或 `main.js` 入口文件中:
|
|
49
|
+
|
|
50
|
+
```ts
|
|
51
|
+
import { createApp } from 'vue';
|
|
52
|
+
import App from './App.vue';
|
|
53
|
+
import BreezeUI from '@breezeui/vue';
|
|
54
|
+
import '@breezeui/vue/dist/index.css'; // 引入样式
|
|
55
|
+
|
|
56
|
+
const app = createApp(App);
|
|
57
|
+
app.use(BreezeUI);
|
|
58
|
+
app.mount('#app');
|
|
59
|
+
```
|
|
60
|
+
|
|
61
|
+
### 按需引入 (推荐)
|
|
62
|
+
|
|
63
|
+
配合 `unplugin-vue-components` 实现自动按需引入。
|
|
64
|
+
|
|
65
|
+
首先安装插件:
|
|
66
|
+
|
|
67
|
+
```bash
|
|
68
|
+
pnpm add -D unplugin-vue-components
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
然后配置 `vite.config.ts`:
|
|
72
|
+
|
|
73
|
+
```ts
|
|
74
|
+
// vite.config.ts
|
|
75
|
+
import { defineConfig } from 'vite';
|
|
76
|
+
import vue from '@vitejs/plugin-vue';
|
|
77
|
+
import Components from 'unplugin-vue-components/vite';
|
|
78
|
+
// 假设 BreezeUI 提供了 Resolver,如果没有,可以手动配置
|
|
79
|
+
// import { BreezeUIResolver } from '@breezeui/vue';
|
|
80
|
+
|
|
81
|
+
export default defineConfig({
|
|
82
|
+
plugins: [
|
|
83
|
+
vue(),
|
|
84
|
+
Components({
|
|
85
|
+
// 如果 BreezeUI 提供了 Resolver
|
|
86
|
+
// resolvers: [BreezeUIResolver()],
|
|
87
|
+
|
|
88
|
+
// 如果没有 Resolver,可以手动指定组件库目录或规则
|
|
89
|
+
// dirs: ['src/components'],
|
|
90
|
+
}),
|
|
91
|
+
],
|
|
92
|
+
});
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
> 注意:按需引入时,如果组件库样式未自动注入,可能需要手动引入样式文件或配置插件处理样式。
|
|
96
|
+
|
|
97
|
+
## 🔨 开发
|
|
98
|
+
|
|
99
|
+
```bash
|
|
100
|
+
# 安装依赖
|
|
101
|
+
pnpm install
|
|
102
|
+
|
|
103
|
+
# 启动开发环境
|
|
104
|
+
pnpm dev
|
|
105
|
+
|
|
106
|
+
# 构建包
|
|
107
|
+
pnpm build
|
|
108
|
+
|
|
109
|
+
# 运行测试
|
|
110
|
+
pnpm test
|
|
111
|
+
```
|
|
112
|
+
|
|
113
|
+
## 📄 License
|
|
114
|
+
|
|
115
|
+
MIT License © 2024-PRESENT BreezeUI Team
|