随着前端技术的不断发展,Vue.js 凭借其轻量、高效、易上手的特性,成为国内外开发者最喜爱的前端框架之一。在构建后台管理系统时,Vue 提供了以下优势:
响应式数据绑定:让页面和数据保持同步,开发效率高。
组件化开发:使得代码结构清晰、可维护性强。
强大的生态:Vue Router、Vuex、Vite 等工具支持构建大型应用。
良好的中文社区:文档丰富,学习资源多,解决问题更方便。
官网文档:https://cn.vuejs.org/
Art Design Pro
- 开源地址:https://github.com/Daymychen/art-design-pro
- 在线预览:https://www.lingchen.kim/art-design-pro
- 技术栈:Vue3、TypeScript、Vite、Element-Plus
- UI框架:Element-Plus
Naive Ui Admin
- 开源地址:https://github.com/jekip/naive-ui-admin
- 在线预览:https://naive-ui-admin.vercel.app
- 在线预览:https://jekip.github.io/
- 技术栈:Vue3.0、Vite 、Naive UI 、TypeScript
- UI框架:Naive UI
Ant Design Vue Pro
- 开源地址:https://github.com/vueComponent/ant-design-vue-pro
- 在线预览:https://preview.pro.antdv.com/user/login
- 技术栈:Ant Design Vue、AntV、Vue2.6
- UI框架:Ant Design Vue
Geeker Admin
- 开源地址:https://github.com/HalseySpicy/Geeker-Admin
- 在线预览:https://admin.spicyboy.cn
- 技术栈:Vue3.4、TypeScript、Vite5、Pinia、Element-Plus
- UI框架:Element-Plus
SoybeanAdmin
- 开源地址:https://github.com/soybeanjs/soybean-admin
- 在线预览:https://soybeanjs.cn/home
- 技术栈:Vue3, Vite6, TypeScript, Pinia 和 UnoCSS
- UI框架:Naive UI、Ant Design Vue 、Element Plus
Vue Vben Admin
- 开源地址:https://gitee.com/annsion/vue-vben-admin
- 在线预览:https://www.vben.pro/#/
- 技术栈:Vue3, Vite, TypeScript
- UI框架:Ant Design Vue、Naive UI、Element Plus
Arco Design Pro Vue
- 开源地址:https://github.com/arco-design/arco-design-pro-vue
- 在线预览:https://vue-pro.arco.design/login
- 技术栈:TypeScript 、Vue3 、Pinia 、Arco Design
- UI框架:Arco Design
vue-pure-admin
- 开源地址:https://github.com/pure-admin/vue-pure-admin
- 在线预览:https://pure-admin.github.io/vue-pure-admin
- 技术栈:Vue3、 Vite、Element-Plus、TypeScript、Pinia、Tailwindcss
- UI框架:Element-Plus
TDesign Vue Next Starter
- 开源地址:https://github.com/Tencent/tdesign-vue-next-starter
- 在线预览:https://tdesign.tencent.com/starter/vue-next/login
- 技术栈:Vue 3, Vite, Pinia, TypeScript
- UI框架:TDesign
SnowAdmin
- 开源地址:https://github.com/WANG-Fan0912/SnowAdmin
- 在线预览:http://101.126.93.137/#/login
- 技术栈:Vue3, Vite6, TypeScript, Pinia
- UI框架:Arco.Design
iView Admin
- 开源地址:https://github.com/iview/iview-admin
- 在线预览:https://admin.iviewui.com
- 技术栈:Vue 2.0
- UI框架:iView
vue-next-admin
- 开源地址:https://github.com/lyt-Top/vue-next-admin
- 开源地址:https://gitee.com/lyt-top/vue-next-admin
- 在线预览:http://vuenextadmin.ccfast.cc/
- 技术栈:vue3.x + CompositionAPI setup 语法糖 + typescript + vite + element plus + vue-router-next + pinia
- UI框架: element plus
项目名称 | Vue版本 | UI 框架 | 在线预览地址 | 开源地址 |
---|---|---|---|---|
Art Design Pro | Vue3 | Element-Plus | 预览 | GitHub |
Naive Ui Admin | Vue3 | Naive UI | 预览1 / 预览2 | GitHub |
Ant Design Vue Pro | Vue2.6 | Ant Design Vue | 预览 | GitHub |
Geeker Admin | Vue3.4 | Element-Plus | 预览 | GitHub |
SoybeanAdmin | Vue3 | Naive UI / AntD Vue / Element Plus | 预览 | GitHub |
Vue Vben Admin | Vue3 | AntD Vue / Naive UI / Element Plus | 预览 | Gitee |
Arco Design Pro Vue | Vue3 | Arco Design | 预览 | GitHub |
vue-pure-admin | Vue3 | Element-Plus | 预览 | GitHub |
TDesign Vue Next | Vue3 | TDesign | 预览 | GitHub |
SnowAdmin | Vue3 | Arco Design | 预览 | GitHub |
iView Admin | Vue2.0 | iView | 预览 | GitHub |
vue-next-admin | Vue3.x | Element Plus | 预览 | GitHub / Gitee |