ChenyCHENYU / Robot_Admin

Robot Admin - 多架构企业级解决方案 当前分支 传统 SPA 架构 Bun Workspaces 多应用管理 Module Federation 初版完成 MicroApp 初版完成 --- 中文 | English 🎯 多架构支持说明 Robot Admin 提供多种架构选择，满足不同规模和场景的需求： | 架构类型 | 适用场景 | 特点 | 分支 | 文档 | | --------------- | -------------------- | -------------------------------- | -------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------- | | **🏗️ 单体架构** | 中小型项目、快速原型 | 简单直接、开箱即用 | | 本文档 | | **📦 Monorepo** | 多应用统一管理 | 代码复用、统一工具链、独立部署 | | 完整指南 | | **🔮 模块联邦** | 微应用动态加载 | 运行时共享、独立部署、版本隔离 | | 使用指南 | | **🚀 微前端** | 大型应用、团队协作 | 技术栈无关、独立部署、渐进式迁移 | | 查看文档 | 📦 Monorepo 架构亮点 基于 **Bun Workspaces** 的 Monorepo 架构已就绪！查看分支 **核心特性：** • ✅ 多应用统一管理（Internal / SaaS） • ✅ 5 个共享包代码复用 • ✅ HMR 热更新（修改共享包，应用自动刷新） • ✅ 独立构建部署 • ✅ 统一工具链（ESLint/Prettier/TypeScript/Commitizen） **快速开始：** 📖 **查看完整 Monorepo 文档** --- 🚀 重新定义企业级中后台开发体验 > **🎯 一个敏捷的，为开发者体验而生的企业级中后台解决方案** _在这里，当 的极致性能遇上 的组合式 API，当 的类型安全拥抱 的原子化样式..._ --- ⚡ 为什么选择 Robot Admin？ 🔥 性能怪兽级别的开发体验 • **毫秒级热更新** - Bun + Vite8 化学反应，告别等待 • **智能类型提示** - TypeScript5.8 + 51+ 自定义组件，IDE 智能感知体验拉满 • **零配置开箱即用** - 一条命令启动，30 秒内搭建完整后台系统 🎨 不只是一个管理系统，更是一个作品 • **54+ 精心打磨的演示页面** - 每一个都是可直接用于生产的业务组件，51 个组件支持文档站 iframe 在线预览 • **7 种自定义指令** - 防抖、节流、长按、拖拽、权限...让开发更优雅 • **主题系统** - 深色/浅色模式/跟随系统 + 支持自定义扩展 • **Preview 路由系统** - 32 个无鉴权独立预览路由，供 文档站 通过 iframe 嵌入实时组件演示 🛠️ 企业级架构，个人项目也能享受 • **RBAC 权限体系** - 菜单级、按钮级、接口级，权限控制细致入微 • **渐进式微前端** - 架构设计支持从单体到微前端的平滑演进 • **生产级工程化** - ESLint + Prettier + Husky，代码质量无忧 --- 🚀 快速开始（真的很快！） > 🎉 **推荐使用 Bun** - 体验前所未有的安装速度 **🔥 首次启动只需 2 秒不到，后续热更新不到 100ms！** 📦 更多命令 --- ✨ 核心亮点 🏗️ 技术栈（高富帅阵容） 查看完整技术栈 **🎭 前端核心** • **Vue 3.5.13** - 🔥 最新稳定版，Composition API 丝滑体验 • **TypeScript 5.8** - 🛡️ 类型安全，智能提示 • **Naive UI 2.41.0** - 🎨 颜值与性能并存的组件库 • **@robot-admin/naive-ui-components** - 🧩 51+ 业务组件库，按需自动导入 • **UnoCSS 66.3.3** - ⚡ 原子化CSS，按需生成，体积极小 **⚙️ 构建工具** • **Bun 1.x** - 🚀 性能怪兽，安装速度提升10倍 • **Vite 8.0.1** - ⚡ Rolldown 统一构建引擎，构建速度提升 10-30x • **Sass 1.87** - 🎨 成熟的CSS预处理器 **🔧 开发工具** • **ESLint 9.21** - 📏 代码质量守护者 • **Prettier 3.5** - ✨ 代码格式化 • **Oxlint 0.15** - 🦀 Rust编写的超快Linter • **Vitest 3.0** - 🧪 现代化测试框架 **📊 功能组件（via @robot-admin/naive-ui-components）** • **ECharts 5.6** - 企业级图表库 • **AntV X6** - 专业流程图引擎（BPMN/ER/UML） • **FullCalendar** - 完整的日程管理 • **WangEditor** - 富文本编辑器 • **XGPlayer** - 视频播放器（HLS/防作弊） • **Vue Flow** - 工作流编辑器 🎯 功能矩阵 🔐 权限管理 • **RBAC权限体系** - 用户-角色-权限，灵活分配 • **动态路由** - 根据权限实时生成菜单 • **按钮级权限** - 精确到每一个操作按钮 • **接口级权限** - API调用权限控制 🧩 组件库（49+ 开箱即用） > 所有业务组件已独立发布为 ，支持按需自动导入。 查看所有组件 **核心组件** • - 动态表单引擎，支持8种布局 • - 超级表格，支持虚拟滚动、打印水印、列设置 • - 高级搜索表单组件 • - 操作按钮组组件，统一按钮布局 • - Iconify 运行时图标管理系统 • - 主题切换组件 • - 国际化语言切换 **业务组件** • - 代码编辑器组件 • - Markdown编辑器 • - WangEditor 富文本编辑器 • - 公式编辑器 • - 时间处理组件 • - 日期选择组件 • - 进度展示组件 • - 文件上传组件 • - Cron 表达式编辑器 • - 步骤条组件 **可视化 & 图表** • - AntV X6 流程图引擎（BPMN/ER/UML） • - Vue Flow 工作流编辑器 • - 甘特图组件 • - 完整日程管理 **媒体 & 文件** • - XGPlayer 视频播放器（HLS/防作弊） • - 文件预览（PDF/Excel/Word/图片） • - 图片裁剪 • - 电子签名 • - 二维码生成 • - 条形码生成 • - 音频播放器，播放列表、多循环模式 **交互 & 布局** • - 拖拽排序 • - 分割面板 • - 折叠面板 • - 瀑布流布局 • - 地区级联选择 • - 城市选择器 • - Leaflet 地图 • - 验证码 • - 新手引导 • - 全局搜索 • - 通知中心 • - 聊天组件，消息泡泡、会话列表 • - 时间线，垂直/水平多布局 • - 右键上下文菜单 • - 穿梭框，跨列表数据迁移 • - 叠加头像组，状态徽标 🎮 自定义指令 复制 | 防抖 | 节流 | 权限 | 水印 | 拖拽 | 长按 🎪 演示页面（54+ 完整示例） 查看所有演示页面 **🎨 基础组件展示** • 图标组件 - 完整的图标系统使用指南 • 地区联动 - 省市区三级联动实现 • 进度条 - 多种样式进度展示 • 时间组件 - 时间选择和格式化 • 日期选择 - 日期范围选择器 • 城市选择 - 城市选择器组件 **📝 表单与表格** • 表单布局 - 8种表单布局模式 • 表单搜索 - 高级搜索功能 • 超级表格 - 表格的各种高级用法 **✏️ 编辑器展示** • 日历组件 - FullCalendar完整功能 • 代码编辑器 - 多语言语法高亮 • Markdown编辑器 - 实时预览编辑 • 富文本编辑 - WangEditor完整功能 **🛠️ 实用功能** • 导出ZIP - 批量文件打包下载 • 复制功能 - 文本复制到剪贴板 • 批量下载 - 文件批量下载处理 • 拖拽排序 - 列表项拖拽排序 • 3D展示 - Spline 3D场景 • 动画系统 - 流畅的页面转场 • 用户引导 - 新手引导系统 **💬 示范组件** • 聊天 - 即时聊天 UI，消息泡泡与会话列表 • 时间线 - 时间轴事件展示，垂直/水平布局 • 右键菜单 - 自定义上下文菜单 • 穿梭框 - 跨列表数据迁移 • 头像组 - 叠加头像展示，状态徽标 • 音频播放器 - 播放列表、进度控制、多循环模式 --- 🏗️ 项目架构 📁 目录结构 查看完整目录结构 🔄 架构演进路线 --- 🛠️ 开发者工具 VS Code 插件推荐 查看完整插件列表和使用说明 必装插件 • **Vue - Official** - Vue 3 官方支持 • **TypeScript Vue Plugin** - TypeScript 支持 • **UnoCSS** - 原子化CSS智能提示 • **Naive UI Snippets** - Naive UI 代码片段 实用插件详解 **1. Vscode Samge Translate 插件** • 用于快速中英文翻译切换，并生成变量命名方式 • Ctrl+Shift+P， 选择 Samge 进行对应功能使用 • 翻译成中文， 翻译成英文 **2. any-rule 插件** • 用于快速生成正则 • 右键 => 正则大全 • 弹出正则选项,根据生成的选项,可以图解正则 **3. Better Comments 插件** • 在js文件中,通过颜色标记区分注释评论描述 • //\* 绿色 //! 红色 //? 蓝色 **4. code settings sync 插件** • 用于快速团队同步 vscode 插件及配置 • 使用文档 **5. Code Spell Checker 插件** • 用于快速检查代码和文档拼写是否正确 • 将非语法错误的单词添加到 cspell.json • 拼写后单词上方提示的黄色小灯泡💡 **6. CodeSnap 插件** • 用于快速生成代码截图 • 右键 => 底部选项 CodeSnap **7. EmoJi 插件** • 用于快速选择表情符号 • 输入 => 输入 • **8. JSON to JS 插件** • 用于快速将json格式转换为js格式 • 从剪切板，选择转换，可选引号 3种 方式进行转换 • 或 **9. koroFileHeader 插件** • 用于添加头部注释，函数注释 • 在文件头部使用快捷键，或自动识别生成 • 头部注释 函数注释 **10. TODO Tree 插件** • 用于快速高亮代码中的 TODO 等标记性注释 • 通过注释关键词的方式，高亮显示 • TODO: 待完成 | BUG: 问题 | FIXME: 待修复 | HACK: 自定义 **11. Turbo Console Log 插件** • 用于快速生成 console 打印信息 • 通过选中变量，按下快捷键，生成打印句柄 • 生成 注释所有 **+u** 启用所有 **+d** 删除所有 --- 🌍 国际化 (i18n) 自动化路由翻译 项目集成了 **vite-auto-i18n-plugin**，支持路由标题的自动翻译。 查看详细使用说明 快速使用 **就这么简单！** 插件会自动调用有道翻译 API 将中文翻译成英文。 工作原理 特性 • ✅ **零配置** - 添加中文标题后运行一条命令即可 • ✅ **自动翻译** - 调用有道翻译 API 自动生成英文 • ✅ **高性能** - O(1) 查找，编译时构建映射表 • ✅ **零维护** - HMR 自动更新，无需手动管理翻译 详细文档 详细文档 📖 完整使用指南：国际化实践指南 - 在线文档 --- 📊 性能优化 ⚡ 性能基准测试 查看详细性能数据 | 指标 | Robot Admin | 传统方案 | 提升幅度 | | :-----------: | :---------: | :------: | :------: | | 🚀 首屏加载 | --- 🤝 参与贡献 > **来啊，快活啊！一起搞事情啊！** 🎉 查看贡献指南 🚀 30秒快速上手贡献 💡 贡献方向 **🎨 UI/演示页面贡献** • 在 下新建页面 • 展示一个完整的业务场景 • 代码要有注释，能复制粘贴直接用 **🧩 组件开发贡献** • 放在 • 组件名以 开头 • 必须有 TypeScript 类型定义 **🛠️ 工具函数贡献** • 目录下 • 要有单元测试 • 要有 JSDoc 注释 查看 贡献指南 了解更多。 --- 🚀 部署方案 ☁️ 多环境支持 查看部署详情 **环境配置** • **开发环境** - 本地开发调试 • **测试环境** - 功能测试验证 • **预发布环境** - 生产前最后验证 • **生产环境** - 线上正式环境 **部署选项** • **Vercel** - 零配置部署（推荐） • **GitHub Pages** - 静态部署 • **D…