跳转到主要内容

awesome -vue -3

https://github.com/vuesomedev/awesome-vue-3

A curated list of awesome things related to Vue 3

 

vue3-antd-admin

基于 vue-cli / vite2.x + vue3.x + antd-design-vue2.x + typescript4.x 的后台管理系统模板

vscode 配置

安装项目根目录.vscode 推荐的插件,再安装 Volar,并禁用 Vetur,重启 vscode 即可。

使用了 Vue3.0 全家桶、ant-design-vue2.0 和 typescript4.0,实践 vue3.0 的新特性以及玩法,不得不说 vue3.0 的 Composition API 相比于 vue2.0 的 Options API 灵活很多,让我们可以灵活地组合组件逻辑,我们可以很轻松的使用 hooks 的形式去代替以前 mixins 等的写法。更多 hooks 可以参考vueuse

功能、组件的封装

  •  动态表格(扩展了伸缩列功能,以及使用 JSON schema 配置生成表格) // TODO 后续有待加强及完善
  •  动态表单(满足基本的需求) // TODO 后续有待加强及完善
  •  自定义弹窗(支持 8 个方向拖拽改变大小以及拖拽移动位置)// TODO: 继承 antd 原组件所有 props
  •  图片视频预览(目前只是简单显示)
  •  分割组件(目前只做了左右)
  •  图标组件封装(本地 svg 封装、阿里图标的在线和离线封装)
  •  其他...

页面功能

系统看板

  •  首页
  •  疫情地图
  •  系统日志
  •  前端性能监控

系统管理

  •  账号管理
  •  角色管理
  •  资源管理
  •  字典管理

 

vue3-admin

https://github.com/newbee-ltd/vue3-admin

🔥 🎉 Vue 3.0 + Vite 2.0 + Vue-Router 4.0 + Element-Plus + Echarts 5.0 + Axios 开发的后台管理系统

newbee-mall 项目是一套电商系统,基于 Spring Boot 2.X 和 Vue 以及相关技术栈开发。 前台商城系统包含首页门户、商品分类、新品上线、首页轮播、商品推荐、商品搜索、商品展示、购物车、订单结算、订单流程、个人订单管理、会员中心、帮助中心等模块。 后台管理系统包含数据面板、轮播图管理、商品管理、订单管理、会员管理、分类管理、设置等模块。

vue3-admin 版本线上预览地址:http://vue3-admin.newbee.ltd,测试账号密码:admin 123456

本仓库中的源码为新蜂商城前后端分离版本的后台管理系统(Vue 版本为 3.x),主要面向前端开发人员,后端 API 源码在另外一个仓库 newbee-mall-api

前后端分离版本包括四个仓库:

/fes.js

Fes.js 是一个好用的前端应用解决方案。 以 Vue 3.0 和路由为基础,同时支持配置式路由和约定式路由,并以此进行功能扩展。配以覆盖编译时和运行时生命周期完善的插件体系,支持各种功能扩展和业务需求。以约定、配置化、组件化的设计思想,让用户仅仅关心用组件搭建页面内容。基于Vue.js,上手简单。经过多个项目中打磨,趋于稳定。

Fes.js 是什么?

Fes.js 是一个优秀的前端应用解决方案。Fes.js 以 Vue 3.0 和路由为基础,同时支持配置式路由和约定式路由,并以此进行功能扩展。配以覆盖编译时和运行时生命周期完善的插件体系,支持各种功能扩展和业务需求。

它主要具备以下功能:

  • 🚀 快速 ,内置了路由、开发、构建等,并且提供测试、布局、权限、国际化、状态管理、API请求、数据字典、SvgIcon等插件,可以满足大部分日常开发需求。

  • 🧨 简单 ,基于Vue.js 3.0,上手简单。贯彻“约定优于配置”思想,设计插件上尽可能用约定替代配置,同时提供统一的插件配置入口,简单简洁又不失灵活。提供一致性的API入口,一致化的体验,学习起来更轻松。

  • 💪 健壮 ,只需要关心页面内容,减少写BUG的机会!提供单元测试、覆盖测试能力保障项目质量。

  • 📦 可扩展 ,借鉴Umi实现了完整的生命周期和插件化机制,插件可以管理项目的编译时和运行时,能力均可以通过插件封装进来,在 Fes.js 中协调有序的运行。

  • 📡 面向未来 ,在满足需求的同时,我们也不会停止对新技术的探索。已使用Vue3.0来提升应用性能,已使用webpack5提升构建性能和实现微服务,未来会探索vite等新技术。

插件

插件 介绍
@fesjs/plugin-access