百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

Vue vben admin - 基于 Vue3 / Ant Design Vue 的高颜值管理后台UI框架

ccwgpt 2024-09-14 00:23 26 浏览 0 评论

基于Vue3.0 / Vite / Ant Design 等火热开源项目构建,新鲜出炉,值得关注。

关于 Vue vben admin

Vue Vben Admin 是一个基于 Vue3.0、Vite 、 Ant-Design-Vue 、TypeScript 构建的后台解决方案,为中大型项目开发提供开箱即用的UI框架,包括二次封装组件、utils、hooks、动态菜单、权限校验、按钮级别权限控制等功能。Vue Vben Admin 所使用的技术都是前端较新的技术栈,可以用来作为项目的启动模版,可以帮助快速搭建企业级中后台产品原型。也可以作为一个学习示例,用于上手学习 vue3,vite,ts 等等主流技术。该项目作者表示会一直持续跟进最新技术,将最新的东西应用与项目之中。

Vue vben admin 框架特点

  • Vue 全家桶。基于Vue3, Vite, Vue Router Next, Vuex Next 开发
  • Typescript。使用Typescript开发
  • Hooks。封装hooks,满足日常开发需求.
  • 权限管理。完善的前后端权限管理方案
  • 组件封装。对日常使用频率较高的组件二次封装,组件很丰富
  • 按需引入。真正的按需引入,只在需要的页面引入

目录结构

├── build # 构建相关脚本
├── mock # 模拟数据
├── public # 静态资源
├── src # 项目代码
│   ├── api #请求相关
│   ├── assets # 静态资源
│   ├── components # 组件
│   ├── design  # 样式
│   ├── enums # 常量,枚举
│   ├── hooks # hooks
│   ├── logics # 逻辑相关
│   ├── layouts # 布局
│   ├── main.ts # 入口文件
│   ├── router #路由,菜单等
│   ├── locale #多语言文件
│   ├── settings # 配置文件
│   ├── plugins # 插件
│   ├── store # vuex
│   ├── utils # 工具类
│   └── views # 页面
└── types # 类型定义

开发上手体验和使用建议

Vue Vben Admin 是一个优雅漂亮的 admin UI 框架,相比很多只关注功能的 admin 项目,颜值非常能打,毕竟对一个未来长期运作的互联网项目来说,选错 admin 在后期想要迭代时非常痛苦,如果时间允许,恨不得推倒重新撸一遍。

Vue Vben Admin 预览

Vue Vben Admin 适合使用 Vue 技术栈的开发者使用,需要注意的是需要熟悉 TS 。支持通过简单配置无需任何代码实现很多定制化的功能,比如修改主题颜色、动画效果,页面布局等,当然也支持我之前一直强调的多标签页面的功能,这对后台管理员的日常操作来说,效率提高非常明显。

Vue Vben Admin 的作者比较贴心地提供了完整版和精简版2个版本,完整版用于学习和查看实现的代码源码,精简版则用于构建新的项目,省的自己去删除大量无用的页面代码才能开始。

但 Vue Vben Admin 发布时间还很短,按项目开发的经验来说,需要经历一定的时间和使用投入才能趋于稳定,官网的文档量还不够,但好在有充足的例子,基本上后台管理能用到的页面和组件都具备了。而 Vue Vben Admin 还使用了 Vue3 / Vite 等前端领域较新的技术栈,建议优先以学习为主,如果要投入实际生产,建议再关注一下再说,当然,如果有能力和精力可以联系作者深入了解这个项目,对项目足够有信心和了解,也是可以投产使用的。

免费开源说明

Vue Vben Admin 的作者是一位国内的开发者,他在业余的时间开源了这个 admin 框架,并以 MIT 开源协议托管在 Github 上,任何人都可以免费下载使用,不限制商用。

关注我,持续分享高质量的免费开源、免费商用的资源。

↓↓点【了解更多】查看本次分享的网址。

相关推荐

NET版本众多,傻傻分不清楚

面对.NET众多的版本,尤其还有几个名称的情况下,相信很多初学C#的开发人员都很困惑,搞不清究竟该怎么选择。下面就列举一下.NET的主要版本及其区别:.NETFramework(传统版本,仅适用于W...

.NET Framework 和 .NET Core 有啥区别?如何选择?

.NETFramework和.NETCore都是由Microsoft开发的软件框架,用于创建Windows应用程序和Web应用程序。它们的主要区别在于:支持的操作系统:.NET...

「分享」介绍一款倍受欢迎的.NET 开源UI库

概述今天要带大家了解的是一款WPF的开源控件库MahApps.Metro。MahApps.Metro是用于创建现代WPF应用程序的工具包,它许多开箱即用的好东西。目前支持的NETFramework...

.NET 5.0正式版发布:应用可在ARM64上原生运行

更多:o梵蒂冈图书馆频繁遭黑客攻击oNPM包被发现窃取敏感的Discord和浏览器文件o作者:硬核老王o(本文字数:712,阅读时长大约:1分钟).NET5.0正式版发布:应用可...

盘点8个热门.Net开源项目

一、SmartFormat:轻量级文本模板库,轻松替代string.Format项目地址:https://github.com/axuno/SmartFormatSmartFormat不仅继承了s...

.NET与Java开发:一场从框架到应用实例的深度对决

在软件开发这片广袤的战场上,.NET与Java两大开发平台如同两位身经百战的将军,各自率领着庞大的开发者队伍,在不同的应用场景中大放异彩。今天,我们就来一场从框架到应用实例的深度对决,看看这两大平台究...

TouchSocket:一个功能强大且易于使用的 .NET 网络通信框架

项目介绍TouchSocket是一个功能强大且易于使用的.NET网络通信框架,适用于C#、VB.Net和F#等语言。它提供了多种通信模块,包括TCP、UDP、SSL、WebSocket、Mo...

远离报错烦恼!深入全面掌握.NET Framework

由于Windows系统对.NETFramework这一系统组件有着极为特殊的要求,而部分应用软件及游戏对其的依赖性也近乎达到了驱动级的水准,使用或安装不当会遭遇许多“未知”的问题,因此如何掌握.NE...

想自己搭建.Net Web框架,开源项目太庞大看不懂,可以看这个教程

大家好,我是编程乐趣。一直以来,我都在运营知识星球,这个月也开始全职专心编写教程了。当时编写教程,就是发现很多程序员工作多年了,都没自己搭建过框架,也没接触过公司的框架底层代码。这就导致一些问题,无法...

.NET 8 + React 18 一体化开发框架!苏州码农十年匠心打磨

开篇前言从2014年入行至今,从WebForms到MVC,从JavaScript到React/Vue,从.NETFramework到.NETCore/8,技术栈的变迁伴随了我整个职业生涯。去年,我...

.Net Framework详解

相信有不少小伙伴遇到过这种情况:安装软件时提示.NetFramework未安装导致软件无法打开,或者需要安装.NetFramework4.0以上的组件。那.NetFramework是什么呢?....

系统小技巧:深入全面掌握.NET Framework

由于Windows系统对.NETFramework这一系统组件有着极为特殊的要求,而部分应用软件及游戏对其的依赖性也近乎达到了驱动级的水准,使用或安装不当会遭遇许多“未知”的问题,因此如何掌握.NE...

前端架构师成长之路:如何在 Vue 的计算属性中传递参数

在Vue中,计算属性(computed)是从其他响应式属性派生的属性,是用于自动监听响应式属性的变化,从而动态计算返回值。计算属性(computed)通常是一个没有参数的函数。当然如果需要像调...

Vue2 vs Vue3:核心差异与升级指南

Vue3自2020年发布以来,凭借其革命性的改进迅速成为开发者关注的焦点。本文将从架构设计、API模式、性能优化等多个维度深入对比Vue2和Vue3的核心差异,并提供代码示例帮助开发者...

突发!Vue3 投屏神器引爆程序员朋友圈

【AlarmLevel】重要【AlarmTitle】突发!Vue3投屏神器引爆程序员朋友圈【AlarmOverview】最近GitHub上名为vue-screen-share的仓库突...

取消回复欢迎 发表评论: