English | 简体中文
开箱即用的企业级 AI 组件库(基于 Vue 3 + Element-Plus)
| 资源类型 | 链接 |
|---|---|
| 文档 | 📖 开发文档 |
| 在线演示 | 👁️ 在线预览 |
| 代码仓库 | 🐙 GitHub 🚠 Gitee |
| NPM 包 | 📦 npm |
| 问题反馈 | 🐛 提交 Bug |
| 交流讨论 | 🐒 交流群 |
| 模版项目 预览 | 👀 在线预览 |
| 模版项目 源码 | 🐙 GitHub 🚠 Gitee |
- ✨ 企业级 AI 组件:内置聊天机器人、语音交互等场景化组件
- 🚀 零配置集成:基于 Element-Plus 设计体系,开箱即用
- 📦 按需加载:提供 Tree Shaking 优化
# NPM npm install vue-element-plus-x # PNPM(推荐) pnpm install vue-element-plus-x # Yarn yarn install vue-element-plus-x
- 按需引入
<script setup> import { BubbleList, XSender } from 'vue-element-plus-x'; const list = [ { content: 'Hello, Element Plus X', role: 'user' } ]; </script> <template> <div style="display: flex; flex-direction: column; height: 230px; justify-content: space-between;" > <BubbleList :list="list" /> <XSender /> </div> </template>
- 全局引入
// main.ts import { createApp } from 'vue'; import ElementPlusX from 'vue-element-plus-x'; import App from './App.vue'; const app = createApp(App); // 使用 app.use() 全局引入 app.use(ElementPlusX); app.mount('#app');
- CDN 引入
<!-- 该方法 有待测试 --> <!-- CDN 引入 --> <script src="https://unpkg.com/vue-element-plus-x@1.3.0/dist/umd/index.js"></script>
| 组件名 | 描述 | 文档链接 |
|---|---|---|
Bubble |
气泡消息组件 (拓展) | 📄 文档 |
BubbleList |
气泡消息列表 (拓展) | 📄 文档 |
Conversations |
会话管理组件 (拓展) | 📄 文档 |
Welcome |
欢迎组件 | 📄 文档 |
Prompts |
提示集组件 | 📄 文档 |
FilesCard |
文件卡片组件 | 📄 文档 |
Attachments |
上传附件组件 | 📄 文档 |
XSender |
智能输入框(含语音交互、提及功能) | 📄 文档 |
Thinking |
思考中组件 (拓展) | 📄 文档 |
ThoughtChain |
思考链组件 | 📄 文档 |
useRecord |
浏览器内置语音识别 API Hooks | 📄 文档 |
useXStream |
流模式接口 Hooks | 📄 文档 |
useSend & XRequest |
流模式 hooks 的拆分 (拓展) | 📄 文档 |
🎀我们会在 issue 、交流群 等多方面收集大家的遇到的问题,和需求场景,制定短期和长期的开发计划,查看详情请移步👉 开发计划
- Fork 仓库 → 2. 创建 Feature 分支 → 3. 提交 Pull Request
详情可以移步👉 开发指南
我们欢迎:
- 🐛 Bug 修复
- 💡 新功能提案
- 📝 文档完善
- 🎨 样式优化
我们采用语义化版本号(SemVer):MAJOR.MINOR.PATCH
- MAJOR: 重大版本更新,可能包含破坏性变更
- MINOR: 新功能添加,向后兼容
- PATCH: Bug 修复,向后兼容
- 预发布标识:
-beta.0,-rc.1等
# 安装稳定版(推荐) pnpm install vue-element-plus-x # 安装 beta 版本 pnpm install vue-element-plus-x@beta # 安装指定版本 pnpm install vue-element-plus-x@2.0.0-beta.0
| 渠道 | npm tag | 说明 |
|---|---|---|
| 稳定版 | latest |
生产环境推荐使用 |
| 测试版 | beta |
新功能预览,可能不稳定 |
文档中的组件可能带有以下徽标:
| 徽标 | 含义 |
|---|---|
| 🆕 新增 | 新增的组件或功能 |
| 🔄 更新 | 最近有重大更新的组件 |
| 即将废弃的组件 | |
| 🔬 实验性 | 实验性功能,API 可能变化 |
- 更新
packages/core/package.json中的版本号为X.X.X-beta.X - 运行
pnpm changeset创建变更记录 - 提交代码并创建 tag:
git tag vX.X.X-beta.X - 推送 tag:
git push origin vX.X.X-beta.X - CI 自动发布到 npm
@betatag
- 更新版本号为正式版本
- 更新
CHANGELOG.md - 创建并推送 tag
- CI 自动发布到 npm
@latesttag
# 克隆仓库 git clone https://github.com/HeJiaYue520/Element-Plus-X.git # 安装依赖 pnpm install # 启动文档开发服务器 pnpm run dev:docs # 启动组件开发服务器 (Storybook) pnpm run dev:core # 构建组件库 pnpm run build:core