[](https://github.com/HeJiaYue520/Element-Plus-X/blob/main/LICENSE) [](https://github.com/HeJiaYue520/Element-Plus-X) [](https://www.npmjs.com/package/vue-element-plus-x) [](https://www.npmjs.com/package/vue-element-plus-x) [](https://github.com/HeJiaYue520/Element-Plus-X/blob/main/packages/components/README.en.md)
[English](./README.en.md) | \*_简体中�?_
# 🚀 Element-Plus-X
\*_开箱即用的企业�?AI 组件库（基于 Vue 3 + Element-Plus�?_
## 📢 快速链�?
| 资源类型 | 链接
|
| ----------------- | -------------------------------------------------------------------------------------------------------------------------- |
| **文档** | [📖 开发文档](https://v2.element-plus-x.com) |
| **在线演示** | [👁�?在线预览](https://v.element-plus-x.com) |
| **代码仓库** | [🐙 GitHub](https://github.com/element-plus-x/Element-Plus-X)
[🚠 Gitee](https://gitee.com/he-jiayue/element-plus-x) |
| \*_NPM �?_ | [📦 npm](https://www.npmjs.com/package/vue-element-plus-x) |
| **问题反馈** | [🐛 提交 Bug](https://github.com/element-plus-x/Element-Plus-X/issues) |
| **交流讨论** | [🐒 交流群](https://github.com/element-plus-x/Element-Plus-X?tab=readme-ov-file#-%E7%A4%BE%E5%8C%BA%E6%94%AF%E6%8C%81) |
| **模版项目 预览** | [👀 在线预览](https://chat.element-plus-x.com/) |
| **模版项目 源码** | [🐙 GitHub](https://github.com/HeJiaYue520/ruoyi-element-ai)
[🚠 Gitee](https://gitee.com/he-jiayue/ruoyi-element-ai) |
## 🛠�?核心特�?
- �?**企业�?AI 组件**：内置聊天机器人、语音交互等场景化组�?- 🚀 **零配置集�?\*：基�?Element-Plus 设计体系，开箱即�?- 📦 **按需加载\*\*：提�?Tree Shaking 优化
## 📦 安装
```bash
# NPM
npm install vue-element-plus-x
# PNPM（推荐）
pnpm install vue-element-plus-x
# Yarn
yarn install vue-element-plus-x
```
## 📚 使用案例
1. **按需引入**
```vue
```
2. **全局引入**
```ts
// 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');
```
3. **CDN 引入**
```html
```
## ⚠️ XMarkdown 组件迁移通知
`XMarkdown` 组件已独立为单独�?NPM 包，推荐使用新版本：
📦 **新包地址�?\* [x-markdown-vue](https://www.npmjs.com/package/x-markdown-vue)
📂 **GitHub�?\* [element-plus-x/x-markdown](https://github.com/element-plus-x/x-markdown)
### 迁移方式
```bash
# 安装新包
pnpm add x-markdown-vue
```
```vue
```
新版本特性：
- 🚀 Vue 3 组合�?API
- 🎨 代码高亮（Shiki，支�?100+ 语言�?- 🌊 流式渲染（支�?AI 对话场景�?- 🧮 LaTeX 数学公式
- 📊 Mermaid 图表
- 🌗 深色模式
- 🔌 灵活的插件系�?
## 🌟 已实�?组件 �?Hooks
| 组件�? | 描述 | 文档链接 |
| -------------------- | ---------------------------------- | --------------------------------------------------------------------- |
| `Bubble` | 气泡消息组件 （拓展） | [📄 文档](https://v2.element-plus-x.com/zh/components/bubble/) |
| `BubbleList` | 气泡消息列表 （拓展） | [📄 文档](https://v2.element-plus-x.com/zh/components/bubbleList/) |
| `Conversations` | 会话管理组件 （拓展） | [📄 文档](https://v2.element-plus-x.com/zh/components/conversations/) |
| `Welcome` | 欢迎组件 | [📄 文档](https://v2.element-plus-x.com/zh/components/welcome/) |
| `Prompts ` | 提示集组�? | [📄 文档](https://v2.element-plus-x.com/zh/components/prompts/) |
| `FilesCard` | 文件卡片组件 | [📄 文档](https://v2.element-plus-x.com/zh/components/filesCard/) |
| `Attachments` | 上传附件组件 | [📄 文档](https://v2.element-plus-x.com/zh/components/attachments/) |
| `XSender` | 智能输入框（含语音交互、提及功能） | [📄 文档](https://v2.element-plus-x.com/zh/components/xsender/) |
| `Thinking` | 思考中组件 （拓展） | [📄 文档](https://v2.element-plus-x.com/zh/components/thinking/) |
| `ThoughtChain` | 思考链组件 | [📄 文档](https://v2.element-plus-x.com/zh/components/thoughtChain/) |
| `useRecord` | 浏览器内置语音识�?API Hooks | [📄 文档](https://v2.element-plus-x.com/zh/components/useRecord/) |
| `useXStream` | 流模式接�?Hooks | [📄 文档](https://v2.element-plus-x.com/zh/components/useXStream/) |
| `useSend & XRequest` | 流模�?hooks 的拆�?（拓展） | [📄 文档](https://v2.element-plus-x.com/zh/components/useSend/) |
## 🎯开发计�?(每周更新)
🎀我们会在 issue 、交流群 等多方面收集大家的遇到的问题，和需求场景，制定短期和长期的开发计划，查看详情请移步�?**[开发计划](https://v2.element-plus-x.com/zh/roadmap.html)**
## 🤝 参与贡献
1. **Fork 仓库** �?2. **创建 Feature 分支** �?3. **提交 Pull Request**
详情可以移步👉 **[开发指南](https://v2.element-plus-x.com/guide/develop.html)**
我们欢迎�?
- 🐛 Bug 修复
- 💡 新功能提�?- 📝 文档完善
- 🎨 样式优化
## 👥 社区支持
加入微信交流群，获取最新动态和技术支�?/p>
交流群如果过期或者失效，可以添加作�?vx
