项目介绍
AceAdmin Max 是基于 Vue 3、TypeScript、Vite 和 Naive UI 构建的中后台管理系统模板。项目目标不是只提供一套页面皮肤,而是提供一套可持续扩展的工程骨架:统一请求层、后端驱动菜单、路由与按钮权限、可迁移的用户偏好、数据字典和可复用 CRUD 组合式函数。
技术栈
| 分类 | 技术 |
|---|---|
| 核心框架 | Vue 3.5、TypeScript 6、Vite 8 |
| UI | Naive UI、IconPark、vicons |
| 状态 | Pinia、pinia-plugin-persistedstate |
| 路由 | Vue Router 5,静态路由 + 登录后动态路由 |
| 网络 | Axios,统一信封、Token、重试、去重、取消与提示 |
| 国际化 | Vue I18n,内置 zh-CN、en-US |
| 可视化 | ECharts 6 |
| 内容组件 | wangEditor、Cropper.js |
| 文件处理 | SheetJS、libarchive.js、7z-wasm、officecrypto-tool |
| 工程质量 | vue-tsc、ESLint flat config、Prettier |
核心能力
- 三种布局模式:垂直布局、双栏布局和内容全屏布局,并支持顶栏、侧栏、页签、面包屑、底部等细粒度偏好配置。
- 登录后获取菜单并动态注册路由,组件路径通过
import.meta.glob懒加载。 v-auth指令、auth()函数和表格行操作统一使用后端下发的操作码。- 标签页与
keep-alive缓存、当前页软重载、固定页签。 - 多服务域名、Token 自动注入与续签、401 退出、幂等请求重试、请求去重和切页取消。
- 数据字典、系统配置、用户信息、主题设置和锁屏状态管理。
- 搜索表单、数据表格、富文本、图片裁剪、图标选择、拖拽、导入导出等示例。
- 控制台、工作台、监控页,以及 403、404、500 异常页。
设计边界
前端权限用于改善界面体验,不能替代服务端鉴权。攻击者可以修改浏览器状态或直接调用接口,因此后端必须在每个受保护接口中验证用户身份和权限。
默认 Token 存储于 localStorage,适合一般前后端分离演示。高安全场景建议改为服务端签发的 HttpOnly + Secure + SameSite Cookie,并配套 CSRF 防护。
浏览顺序
首次使用建议依次阅读: