从零搭建后台?Vite8+Vue3.5 通用Admin模板,开箱即用!
你还在从零搭建后台系统吗?试试这款最新研发的vite8.x+vue3+pinia3搭配element-plus、naive-ui、arco-design组件库构建中后台管理系统模板。



功能特性
|
特性分类
|
功能清单
|
详细说明
|
|---|---|---|
|
🎨 UI 组件库
|
多版本可选
|
提供 ArcoDesign、Element Plus、Naive UI 三个版本,可按团队技术栈自由选择
|
|
🌗 主题模式
|
亮色 + 暗黑主题
|
内置双主题模式,支持一键切换,暗黑模式深度适配所有组件与业务页面
|
|
📐 布局系统
|
4 种布局模式
|
内置经典、分栏、纵向、横向四种布局,满足不同后台系统的导航习惯
|
|
🌍 国际化
|
多语言支持
|
集成
vue-i18n,内置中文、英文、繁体三种语言包,可快速扩展其他语种 |
|
🧭 导航体验
|
面包屑 + 标签栏
|
顶部面包屑导航 + 多标签页快捷切换,支持页面缓存,关闭标签不丢失操作状态
|
|
📂 菜单与导航
|
多级菜单 + 侧边栏收缩
|
路由配置驱动多级菜单,侧边栏支持完全收起/展开,提升内容区可视面积
|
|
⚙️ 系统与设置
|
全屏 + 抽屉设置
|
支持页面全屏展示,系统配置面板以侧边抽屉形式呼出,实时预览布局与主题变更
|
|
📦 业务模块
|
开箱即用的业务套件
|
整合图表、表格、表单、动态权限控制、错误处理等常见后台模块,降低开发成本
|
|
🧩 扩展能力
|
优雅简约 + 可扩展
|
界面设计简约克制,架构层面预留布局模板扩展点,方便自行定制专属布局
|

项目技术栈
|
分类
|
技术/依赖
|
版本
|
说明
|
|---|---|---|---|
|
🛠 开发工具
|
Visual Studio Code
|
-
|
推荐主力编辑器,配合 Volar 插件获得最佳 Vue3 开发体验
|
|
⚡ 核心框架
|
Vite
|
^8.0.16 |
次世代前端构建工具,极速冷启动与热更新
|
|
Vue
|
^3.5.35 |
渐进式 JavaScript 框架,采用 Composition API
|
|
|
Vue Router
|
^5.1.0 |
官方路由管理器,支持动态路由与路由守卫
|
|
|
🎨 UI 组件库
|
ArcoDesign
|
@arco-design/web-vue@^2.58.0 |
字节跳动出品的企业级设计系统,Vue3 版本组件丰富
|
|
🗄 状态管理
|
Pinia
|
^3.0.4 |
Vue 官方推荐的状态管理库,轻量直观
|
|
pinia-plugin-persistedstate
|
^4.7.1 |
Pinia 持久化插件,基于 localStorage 自动同步状态
|
|
|
🌍 国际化
|
Vue I18n
|
^11.4.5 |
Vue 官方国际化方案,支持多语言切换
|
|
📊 图表可视化
|
ECharts
|
^6.1.0 |
百度开源的强大图表库,支持多种可视化需求
|
|
📝 编辑器
|
md-editor-v3
|
^6.5.1 |
Vue3 Markdown 编辑器组件,支持实时预览
|
|
🎭 模拟数据
|
Mock.js
|
^1.1.0 |
生成随机数据,拦截 Ajax 请求,便于前后端分离开发
|
|
🎨 样式预处理
|
Sass
|
^1.100.0 |
CSS 预处理器,支持变量、嵌套、混合等特性
|




项目框架结构






vite-vue3-admin布局模板


经典布局结构











爆肝一周!自研 Vite8 + Vue3.5 清爽型通用后台模板,支持三套 UI 版本。
适用场景
- 中后台管理系统(CMS / OA / ERP / 数据平台)
- 快速原型验证
- 新手学习 Vue3 + Vite8 工程化
- 多项目复用同一套骨架
这套模板的目标不是“功能堆满”,而是:
清爽、好改、不绑架业务、能直接写页面
Vite8 的极速冷启 + Vue3.5 的 Composition API + Pinia3 的简洁状态,
再配合三套 UI 版本与完整后台骨架。
如果对你有启发,欢迎点赞 / 收藏 / 转发
原文地址: https://www.cveoy.top/t/topic/qHP6 著作权归作者所有。请勿转载和采集!