🎭 前端核心

• Vue 3.5.13 - 🔥 最新稳定版,Composition API 丝滑体验
• TypeScript 5.8 - 🛡️ 类型安全,智能提示
• Naive UI 2.41 - 🎨 颜值与性能并存的组件库
• UnoCSS 66.0 - ⚡ 原子化CSS,按需生成,体积极小

⚙️ 构建工具

• Bun 1.x - 🚀 性能怪兽,安装速度提升10倍
• Vite 7.0.6 - ⚡ 下一代构建工具,热更新极速
• Sass 1.87 - 🎨 成熟的CSS预处理器

🔧 开发工具

• ESLint 9.21 - 📏 代码质量守护者
• Prettier 3.5 - ✨ 代码格式化
• Oxlint 0.15 - 🦀 Rust编写的超快Linter
• Vitest 3.0 - 🧪 现代化测试框架

📊 功能组件

• ECharts 5.6 - 企业级图表库
• AntV X6 - 专业流程图引擎
• FullCalendar - 完整的日程管理
• WangEditor - 富文本编辑器

核心组件

• C_Form - 动态表单引擎,支持8种布局
• C_Table - 超级表格,支持虚拟滚动
• C_Header - 响应式头部组件
• C_Menu - 智能导航菜单
• C_Icon - 图标管理系统
• C_Theme - 主题切换组件

业务组件

• C_Code - 代码编辑器组件
• C_Markdown - Markdown编辑器
• C_Time - 时间处理组件
• C_Progress - 进度展示组件
• C_Chart - 图表组件封装
• C_Upload - 文件上传组件

编辑器生态

• WangEditor - 富文本编辑器
• Markdown编辑器 - 实时预览,语法高亮
• 代码编辑器 - 支持多语言语法高亮
• JSON编辑器 - 结构化数据编辑

文件处理

• Excel导入导出 - 支持复杂表格结构
• ZIP批量下载 - 文件打包压缩
• 图片截图 - Html2canvas 网页截图
• 文件上传 - 多格式文件支持

🎨 基础组件展示

• 图标组件 - 完整的图标系统使用指南
• 地区联动 - 省市区三级联动实现
• 进度条 - 多种样式进度展示
• 时间组件 - 时间选择和格式化
• 日期选择 - 日期范围选择器
• 城市选择 - 城市选择器组件

📝 表单与表格

• 表单布局 - 8种表单布局模式
• 表单搜索 - 高级搜索功能
• 超级表格 - 表格的各种高级用法

✏️ 编辑器展示

• 日历组件 - FullCalendar完整功能
• 代码编辑器 - 多语言语法高亮
• Markdown编辑器 - 实时预览编辑
• 富文本编辑 - WangEditor完整功能

🛠️ 实用功能

• 导出ZIP - 批量文件打包下载
• 复制功能 - 文本复制到剪贴板
• 批量下载 - 文件批量下载处理
• 拖拽排序 - 列表项拖拽排序
• 3D展示 - Spline 3D场景
• 动画系统 - 流畅的页面转场
• 用户引导 - 新手引导系统

• Vue - Official - Vue 3 官方支持
• TypeScript Vue Plugin - TypeScript 支持
• UnoCSS - 原子化CSS智能提示
• Naive UI Snippets - Naive UI 代码片段

1. Vscode Samge Translate 插件

• desc: 用于快速中英文翻译切换,并生成变量命名方式
• use: Ctrl+Shift+P, 选择 Samge 进行对应功能使用
• key: Alt+x 翻译成中文, Alt+z 翻译成英文

2. any-rule 插件

• desc: 用于快速生成正则
• use: 右键 => 正则大全
• key: @zz 弹出正则选项,根据生成的选项,可以图解正则

3. Better Comments 插件

• desc: 在js文件中,通过颜色标记区分注释评论描述
• use: //* 绿色 //! 红色 //? 蓝色

4. code settings sync 插件

• desc: 用于快速团队同步 vscode 插件及配置
• use: 使用文档

5. Code Spell Checker 插件

• desc: 用于快速检查代码和文档拼写是否正确
• use: 将非语法错误的单词添加到 cspell.json
• key: 拼写后单词上方提示的黄色小灯泡💡

6. CodeSnap 插件

• desc: 用于快速生成代码截图
• use: 右键 => 底部选项 CodeSnap

7. EmoJi 插件

• desc: 用于快速选择表情符号
• use: 输入 Ctrl+Shift+P => 输入 emo
• key: F1 => emo

8. JSON to JS 插件

• desc: 用于快速将json格式转换为js格式
• use: 从剪切板,选择转换,可选引号 3种 方式进行转换
• key: Shift + Ctrl + Alt + V | S 或 F1 => Clipboard

9. koroFileHeader 插件

• desc: 用于添加头部注释,函数注释
• use: 在文件头部使用快捷键,或自动识别生成
• key: ctrl+win+i 头部注释 ctrl+win+t 函数注释

10. TODO Tree 插件

• desc: 用于快速高亮代码中的 TODO 等标记性注释
• use: 通过注释关键词的方式,高亮显示
• key: TODO: 待完成 | BUG: 问题 | FIXME: 待修复 | HACK: 自定义

11. Turbo Console Log 插件

• desc: 用于快速生成 console 打印信息
• use: 通过选中变量,按下快捷键,生成打印句柄
• key: ctrl+alt+l 生成 alt+shift+c 注释所有 +u 启用所有 +d 删除所有

测试环境: HP 幽灵360, 16GB RAM, Node.js 22+

• Tree Shaking - 无用代码自动移除
• 代码分割 - 按需加载,减少首屏时间
• 资源压缩 - CSS/JS/图片智能压缩
• CDN加速 - 静态资源CDN部署

• 虚拟滚动 - 大数据表格流畅渲染
• 组件懒加载 - 路由级别懒加载
• 图片懒加载 - 视口内图片按需加载
• 防抖节流 - 高频操作性能优化

# 1. Fork + Clone
git clone https://github.com/你的用户名/robot_admin.git
# 2. 安装依赖
bun install
# 3. 创建分支
git checkout -b feat/awesome-feature
# 4. 提交修改
git commit -m "feat: 新功能"
# 5. 提交PR

🎨 UI/演示页面贡献

• 在 src/views/demo/ 下新建页面
• 展示一个完整的业务场景
• 代码要有注释,能复制粘贴直接用

🧩 组件开发贡献

• 放在 src/components/global/
• 组件名以 C_ 开头
• 必须有 TypeScript 类型定义

🛠️ 工具函数贡献

• src/utils/ 目录下
• 要有单元测试
• 要有 JSDoc 注释

查看 贡献指南 了解更多。

环境配置

• 开发环境 - 本地开发调试
• 测试环境 - 功能测试验证
• 预发布环境 - 生产前最后验证
• 生产环境 - 线上正式环境

部署选项

• Vercel - 零配置部署(推荐)
• GitHub Pages - 静态部署
• Docker - 容器化部署
• 传统服务器 - Nginx部署

# Docker部署
docker build -t robot-admin .
docker run -p 80:80 robot-admin
# Nginx配置
location / {
 try_files $uri $uri/ /index.html;
}

规划中项目

• Robot UI - 独立的组件库
• Robot CLI - 脚手架工具
• Robot Mobile - 移动端解决方案
• Robot Backend - NestJS 后端服务

已发布插件

• vite-console-plugin - Vite 启动台控制台美化与提示插件
• ts-type-cleaner - TypeScript 类型分析和清理工具
• robot-admin-env-manager - Robot Admin 环境配置管理工具
• git-branch-check-diff-commits - 快速比对合并分支同步检查
• vite-plugin-preloader - 智能路由预加载插件

• Node.js: >= 20.19.0 (推荐 22.12+)
• Bun: >= 1.2.19 (推荐最新版)
• 内存: >= 8GB RAM
• 存储: >= 1GB 可用空间
• 系统: Windows 10+, macOS 12+, Ubuntu 20.04+

• VS Code: 推荐编辑器
• Git: >= 2.20.0
• Docker: >= 20.0 (容器部署)

选择 Robot Admin 的理由:

• 🚀 性能优先: Bun + Vite7 双引擎,开发体验极致
• 🧩 组件丰富: 30+ 业务组件,开箱即用
• 🎨 设计现代: Naive UI + UnoCSS,颜值与性能并存
• 📚 学习友好: 30+ 演示页面,每个都是最佳实践

🔧 为什么推荐使用Bun?

• 安装速度提升10倍+
• 内存占用更低
• 内置打包器、测试运行器
• 完全兼容Node.js生态

🎨 如何自定义主题?

1. 修改 src/assets/css/theme.scss 中的CSS变量
2. 使用 C_Theme 组件进行动态切换
3. 支持深色/浅色模式自动切换

🔐 权限系统如何使用?

• 页面级:路由守卫控制
• 菜单级:动态菜单生成
• 按钮级:v-permission指令
• 接口级:axios拦截器

📱 是否支持移动端?

• 完全支持!响应式设计适配所有设备

🔄 如何从其他项目迁移?

• 提供详细的迁移指南
• 组件API基本兼容
• 渐进式迁移支持

核心技术

• Vue.js 团队 - 提供强大的框架基础
• Naive UI 团队 - 提供优秀的组件库
• Vite 团队 - 提供极速的构建工具
• Bun 团队 - 提供革命性的运行时
• Anthony Fu - UnoCSS、unplugin等工具的创作者
• 尤雨溪 (Evan You) - Vue.js 的创造者

功能组件

• ECharts - 数据可视化图表库
• AntV X6 - 图编辑引擎
• FullCalendar - 日历组件
• WangEditor - 富文本编辑器

• 所有 Star 的开发者 - 给予项目信心和动力
• 提出 Issue 的用户 - 帮助项目发现和改进问题
• 贡献 PR 的开发者 - 让项目变得更好
• 使用项目的企业 - 验证项目的实用价值

"一个人可以走得很快,但一群人可以走得更远。感谢每一位支持 Robot Admin 的朋友!"