原文链接：Vue3 后台管理系统模板推荐。
之前写了一篇关于 Vue2 的后台管理系统模板的推荐，详情请见 Vue后台管理系统模板推荐。
Vue3 在今年2月份已成为新的默认版本，本文收集了一些 Vue3 的后台管理系统模板，分享给在座的仌 ?。
还是老规矩，按照 Github 星标数量来依次介绍。
个人较推荐 vue-vben-admin、vue-pure-admin、naive-ui-admin、vue3-composition-admin、vue-next-admin。意见仅供参考，具体可根据团队审美，业务需求选择一款更契合的后台管理系统模板。
如果后台选择的是go语言，可以考虑这一款。
gin-vue-admin（github上的标星数为14.2k）基于 vite + vue3 + gin 搭建的开发基础平台（支持TS，JS 混用），集成 jwt鉴权，权限管理，动态路由，显隐可控组件，分页封装，多点登录拦截，资源权限，上传下载，代码生成器，表单生成器等开发必备功能。
MySql>5.7版本，数据库引擎 innoDB，使用 gorm 实现对数据库的基本操作，已添加对sqlite数据库的支持。Redis实现记录当前活跃用户的jwt令牌并实现多点登录限制。Swagger构建自动化文档。yaml格式的配置文件。jwt和casbin实现的权限管理config.yaml中把system中的useMultipoint修改为true(需要自行配置Redis和Config中的Redis参数，测试阶段，有bug请及时反馈)。
Vue-Vben-Admin（github上的标星数为13.5k）是一个基于 Vue3.0、Vite、 Ant-Design-Vue、TypeScript 的后台解决方案，目标是为开发中大型项目提供开箱即用的解决方案。包括二次封装组件、utils、hooks、动态菜单、权限校验、按钮级别权限控制等功能。项目使用前端较新的技术栈，可以作为项目的启动模版，以帮助你快速搭建企业级中后台产品原型。
原 vue-admin-beauteful 。
vue-admin-better（github上的标星数为7.2k 12.8k）主线版本基于 element-plus、element-ui、ant-design-vue 三者并行开发维护，同时支持电脑，手机，平板。
特性：
预览效果：
vue-pure-admin（github上的标星数为3.4k）是一个免费开源的中后台模版。使用了最新的 Vue 3、Vite2、Element Plus 、TypeScript、等主流技术开发，开箱即用的中后台前端解决方案，也可用于学习参考。
精简版 是基于vue-pure-admin提炼出的架子，包含主体功能，更适合实际项目开发，打包后的大小仅 3MB。
Tauri 版 比electron更强（tauri 与 electron 的对比），如果没有安装tauri，请阅读 tauri官方文档。
本地开发推荐使用 Chrome 80+ 浏览器（不要用360、QQ等国内厂商浏览器，懂得都懂），支持现代浏览器，不支持 IE。
Naive Ui Admin（github上的标星数为2.8k）是一个基于 Vue3.0、Vite、 Naive UI、TypeScript 的中后台解决方案，它使用了最新的前端技术栈，并提炼了典型的业务模型，页面，包括二次封装组件、动态菜单、权限校验、粒子化权限控制等功能，它可以帮助你快速搭建企业级中后台项目。
Vue3、Typescript、Pinia、Vite等前端前沿技术
Geeker-Admin（github上的标星数为2.1k）基于 Vue3.2、Vite2、TypeScript、Pinia、Element Plus 开源的一套后台管理模板。
vue3-antd-admin（github上的标星数为2k）基于vue-cli5.x/vite2.x + vue3.x + ant-design-vue3.x + typescript hooks 的基础后台管理系统模板。 集成RBAC的权限系统，JSON Schema动态表单，动态表格，漂亮锁屏界面等。
项目的基础版本出自于源于 花裤衩 大佬的 vue-element-admin。
vue3-composition-admin（github上的标星数为1.9k）是一个后台前端解决方案，它基于 vue, typescript 和 element-ui 实现，项目都是以composition api风格编写。
本项目使用了最新的前端技术栈，内置了 i18 国际化解决方案，动态路由，权限验证，提炼了典型的业务模型，提供了丰富的功能组件，它可以帮助你快速搭建企业级后台产品原型。
- 用户管理
- 登录（视频背景）
- 注销
- 权限验证
- 页面权限
- 指令权限
- 权限配置
- 二步登录
- 全局功能
- iconfont
- 国际化多语言
- 多种动态换肤
- 动态侧边栏（支持多级路由嵌套）
- 动态面包屑
- 快捷导航(标签页)
- 本地/后端 mock 数据
- Screenfull全屏
- 自适应收缩侧边栏
- 编辑器
- 富文本
- Excel
- 导出excel
- 导入excel
- 前端可视化excel
- 导出zip
- 表格
- 动态表格
- 拖拽表格
- 内联编辑
- 错误页面
- 401
- 404
- 組件
- 头像上传
- 返回顶部
- 拖拽Dialog
- 拖拽Select
- 拖拽看板
- 列表拖拽
- Dropzone
- Sticky
- CountTo (to do)
- 综合实例
- 错误日志
- Dashboard
- 引导页
- ECharts 图表
- Clipboard(剪贴复制)
Soybean Admin（github上的标星数为1.3k）是一个基于 Vue 3、Vite3、TypeScript、NaiveUI、Pinia 和 UnoCSS 的清新优雅的中后台模版，它使用了最新的前端技术栈，内置丰富的主题配置，有着极高的代码规范，基于 mock 实现的动态权限路由，开箱即用的中后台前端解决方案，也可用于学习参考。
vue-admin-box（github上的标星数为929）是一个免费并且开源的中后台管理系统模板。使用最新版本的 vue3 + vite + element-plus 开发而成，目的是为了解决通用型的业务中后台系统复杂的配置。
Fantastic-admin是一款开箱即用的 Vue 中后台管理系统框架。有 vue2（现已停止维护）和 vue3 的版本。
基础版：
专业版：
| ⭐功能与服务⭐ | 基础版 | 专业版 |
|---|---|---|
| 长期维护更新，提供新特性 | ✔️ | ✔️ |
| 定期修复 bug | ✔️ | ✔️ |
| 开发与构建工具 | Vue 3 / Vite 3 | Vue 3 / Vite 3 |
| UI 组件库 | Element Plus | Element Plus |
| 页面布局 | 3 套 | 20 套 |
| 主题风格 | 明亮 1 款 / 暗黑 1 款 | 明亮 6 款 / 暗黑 6 款 |
| 导航路由配置项 | 8 个 | 17 个 |
| 外链导航 | ✔️ | ✔️ |
| 内嵌导航 | ❌ | ✔️ |
| Tab 标签栏 | ❌ | ✔️ |
| 全方位权限验证 | ✔️ | ✔️ |
| 扩展组件 | 12 个 | 20 个 |
| 国际化 | ❌ | ✔️ |
| Mock 数据 | ✔️ | ✔️ |
| 错误日志上报 | ❌ | ✔️ |
| 文件自动生成 | 支持部分 | ✔️ |
| 业务应用静态页面 | ❌ | ✔️ |
| 团队代码规范 | ✔️ | ✔️ |
| 框架版权信息 | 需保留 | 可删除 |
Gitee 上面的 stars 为 3.6k。
基于 vue3.x + CompositionAPI + typescript + vite + element plus + vue-router-next + next.vuex，适配手机、平板、pc 的后台开源免费模板，希望减少工作量，帮助大家实现快速开发。
项目介绍随着我国经济迅速发展,人们对手机的需求越来越大,各种手机软件也都在被广泛应用,但是对于手机进行数据信息管理,对于手机的各种软件也是备受用户的喜爱小学生兴趣延时班预约小程序的设计与开发被用户普遍使用,为方便用户能够可以随时进行小学生兴趣延时班预约小程序的设计与开发的数据信息管理,特开发了小程序的设计与开发的管理系统。小学生兴趣延时班预约小程序的设计与开发的开发利用现有的成熟技术参考,以源代码为模板,分析功能调整与小学生兴趣延时班预约小程序的设计与开发的实际需求相结合,讨论了小学生兴趣延时班预约小程序的设计与开发的使用。开发环境开发说明：前端使用微信微信小程序开发工具：后端使用ssm：VU
我是ruby的新手，我认为重新构建一个我用C#编写的简单聊天程序是个好主意。我正在使用Ruby2.0.0MRI(Matz的Ruby实现)。问题是我想在服务器运行时为简单的服务器命令提供I/O。这是从示例中获取的服务器。我添加了使用gets()获取输入的命令方法。我希望此方法在后台作为线程运行，但该线程正在阻塞另一个线程。require'socket'#Getsocketsfromstdlibserver=TCPServer.open(2000)#Sockettolistenonport2000defcommandsx=1whilex==1exitProgram=gets.chomp
这个问题在这里已经有了答案:WhydoRubysettersneed"self."qualificationwithintheclass?(3个答案)关闭29天前。给定这段代码:classSomethingattr_accessor:my_variabledefinitialize@my_variable=0enddeffoomy_variable=my_variable+3endends=Something.news.foo我收到这个错误:test.rb:9:in`foo':undefinedmethod`+'fornil:NilClass(NoMethodError)fromtes
参考文章搭建文章gitte源码在线体验可以注册两个号来测试演示图：一.整体介绍 介绍SignalR一种通讯模型Hub(中心模型，或者叫集线器模型)，调用这个模型写好的方法，去发送消息。 内容有： ①：Hub模型的方法介绍 ②：服务器端代码介绍 ③：前端vue3安装并调用后端方法 ④：聊天室样例整体流程：1、进入网站->调用连接SignalR的方法2、与好友发送消息->调用SignalR的自定义方法 前端通过，signalR内置方法.invoke() 去请求接口3、监听接受方法（渲染消息）通过new signalR.HubConnectionBuilder().on
关闭。这个问题是opinion-based.它目前不接受答案。想要改进这个问题？更新问题，以便editingthispost可以用事实和引用来回答它.关闭9年前。Improvethisquestion首先，我想避免一场关于语言的口水战。可供选择的语言有Perl、Python和Ruby。我想提一下，我对所有这些都很满意，但问题是我不能只专注于一个。例如，如果我看到一个很棒的Perl模块，我必须尝试一下。如果我看到一个不错的Python应用程序，我必须知道它是如何制作的。如果我看到RubyDSL或一些Ruby巫术，我就会迷上Ruby一段时间。目前我是一名Java开发人员，但计划在不久的将来
我想知道使用fork{}从Rails应用程序“后台”处理是否是个好主意...从我收集到的fork{my_method;Process#setsid}实际上做了它应该做的事情。1)创建另一个具有不同PID的进程2)不中断调用过程(例如它继续w/o等待fork完成)3)执行子进程直到它完成..这很酷，但这是个好主意吗？fork到底在做什么？它会在内存中创建我的整个railsmongrel/passenger实例的重复实例吗？如果是这样那就太糟糕了。或者，它是否以某种方式在不消耗大量内存的情况下完成。我的最终目标是取消我的后台守护进程/队列系统，转而支持这些进程的fork(主要是发送电子邮件
平时开发中我们经常会遇到这样的需求，在一个不限高度的盒子中会有很多内容，如果全部显示用户体验会非常不好，所以可以先折叠起来，当内容达到一定高度时，显示展开更多按钮，点击即可显示全部内容，先来看看效果图： 这样做用户体验瞬间得到提升，接下来看看具体细节。0">主要操作在内容这里{{item.username}},……展开更多样式大家可依据自己项目需求进行设计，这里就不贴了，主要说几个关键的。1、在data中定义三个属性isShowMore:false, //控制展开更多的显示与隐藏textHeight:null, //框中内容的高度status:false, //内容状态是否打开2.计算内容是否
我有一个Ruby脚本，它想要确定它的绝对路径，以便找到一些相对于脚本存储的数据文件。最简单/最好的方法是什么？ 最佳答案 这可以简单地使用:File.expand_path$0 关于ruby-如何找到当前运行的Ruby脚本的绝对路径？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questions/7802630/
这里写自定义目录标题一、问题二、解决三、解决方案四、打包预览一、问题在使用vue3.2和vite2开发一个移动端或者钉钉端H5微服务iosapp内置浏览器打开没问题安卓app内置浏览器打开空白页面vconsole打印出现报错globalthisundefind二、解决内置浏览器版本比较低打印出来是63vue3代码不兼容低版本浏览器三、解决方案步骤一：vite.config.ts里build.target配置项指定构建目标为es2015或者步骤二：安装@vitejs/plugin-legacy安装完报错也还在指定版本可以解决“@vitejs/plugin-legacy”:“1.8.0”,步骤三：
让我们假设一个脚本需要访问一个目录，比如在“任意”操作系统上的/some/where/abc。在Ruby中构建路径有几个选项:File.join('','some','where','abc')File.absolute_path("some#{File::SEPARATOR}where#{File::SEPARATOR}abc",File::SEPARATOR)标准API中的路径名我相信第一个解决方案足够清晰，但符合惯用语。根据我的经验，一些代码审查会要求评论来解释它的作用......问题有没有更好的方法来构建绝对路径是Ruby，其中更好的意思是“完成工作并为自己说话”？