Vue Material Admin 是一个基于 Vuetify.js
组件库的开源中后台模板,采用了服务器端 + 前端全栈TypeScript技术开发,该项目遵循 Material Design 的设计规范,并在 Vuetify.js 基础组件继续向上构建开发,对其进行了扩展和优化,旨在实现一个轻量化、高性能的中后台解决方案,Vue Material Admin 目前阶段主要用于学习、功能展示和开发用例测试,同时也适合作为新项目的启动模板,项目将持续更新,增加更多的功能和优化现有的模块 🔥🔥🔥
- 框架: Vue3
- 构建工具: Vite
- 状态管理: Pinia
- 类型系统: TypeScript
- UI 组件库: Vuetify.js
- 图形库: Pixi.js, Babylon.js, Three.js
- 框架: Nest.js
- 数据库: MySQL
- 缓存: Redis
- 认证: JWT
- 权限管理: RBAC
🧱Vercel需要墙!打不开的同学自行下载项目在本地开发环境预览
- 🍳 Vuetify 组件
- ✅ Table
- ✅ Calendar
- ✅ DictSelect(自动注册可枚举字典下拉框)
- 🏡 智能家居控制组件
- ✅ 环形控制器(支持鼠标拖动进度)
- ✅ 360度全景图预览(其实是Babylon.js的一个API而已)
- 🔥 Pixi.js捕鱼DEMO
- ✅ 小鱼自动移动
- ✅ 射击撒网
- ❌ 小鱼获取新位置后旋转对应角度方向
- ❌ 击落效果获取金币
- ❌ 音频
- 🐝 适配
- ✅ 夜间模式
- ✅ 适配移动设备(大部分适配)
- ✅ 主题颜色修改
- 💻 后端 Nest.js
- ✅ JWT 认证
- ✅ 菜单管理
- ✅ RBAC 权限控制
⚠️ 本地开发需要nodejs 18/20
vite5不支持更低的nodejs版本
git clone https://github.com/armomu/vue-material-admin.git
cd vue-material-admin
pnpm install
pnpm run dev
接口文档 https://nliq7vrniv.apifox.cn
非常感谢 zclzone大佬提供的Nestjs服务项目,让我快速搭建了这个模版的后台服务,也从vue-naive-admin项目中学习到了一些新的封装思路
后端服务启动请切换到 Serve 分支查看教程,注意MySQL要导入Serve分支下的sql脚本的数据