关于vue3:Vue3-admin后台模板

0次阅读

共计 3637 个字符,预计需要花费 10 分钟才能阅读完成。

没有什么比图片更有说服力,是的正如你所见,vue-admin-beautiful 是开源 admin 框架中 vue+element-ui 的最佳实际,目前已实现四种布局(综合布局、画廊布局、纵向布局、横向布局),为来将反对分组布局,四种主题(默认、陆地之心、绿荫草场、光荣典藏)共计 16 种布局主题搭配。

简体中文 | English

<div align=”center”><img width=”200″ src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/logo/vab.png”/>
<h1> vue-admin-better</h1>

<p> 春已至,万物始,愿所有美妙纷沓而来!</p>
</div>


🎉 个性

  • 💪 40+ 高质量单页
  • 💅 RBAC 模型 + JWT 权限管制
  • 🌍 10 万 + 我的项目理论利用
  • 👏 良好的类型定义
  • 🥳 开源版本反对收费商用
  • 🚀 跨平台 PC、手机端、平板
  • 📦️ 后端路由动静渲染

🌐 地址

  • 🎉 vue2.x + element-ui(收费商用,反对 PC、平板、手机)
  • ⚡️ vue3.x + element-plus(alpha 版本,收费商用,反对 PC、平板、手机)
  • ⚡️ vue3.x + ant-design-vue(beta 版本,收费商用,反对 PC、平板、手机)
  • ⚡️ vue3.x + vite + arco
  • 🚀 admin pro 演示地址(vue2.x 付费版本,反对 PC、平板、手机)
  • 🚀 admin plus 演示地址(vue3.x 付费版本,反对 PC、平板、手机)
  • 📌 pro 及 plus 购买地址 authorization
  • 🚀 Vue Shop Vite 商城(付费版本)行将公布,敬请期待!
  • 🌐 github 仓库地址
  • 🌐 码云仓库地址

<!– ## 🌐 备份地址(反对 https 网站自动更新)

  • 🚀 admin pro 演示地址(付费版本,反对 PC、平板、手机)
  • 🚀 admin plus 演示地址(vue3.x 付费版本,反对 PC、平板、手机)–>

🍻 前端探讨 QQ 群

  • 请咱们喝杯咖啡,打赏后分割 QQ 783963206 邀请您进入探讨群(因为用户数较多,如果您打赏后未通过好友申请,请分割商家),不论您请还是不请,您都能够享受到开源的代码,感谢您的反对和信赖,群内提供 vue-admin-better 根底版本、开发工具主动配置教程及我的项目开发文档。

    <img width=”200px” src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/zfb_kf.jpg”> <img width=”200px” src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/qq_group/vab-2.jpg”> <img width=”200px” src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/qq_group/vab-3.jpg”>

📦️ 桌面应用程序

  • Admin Pro
  • Admin Plus

🌱 vue3.x vue3.0-antdv 分支(ant-design-vue)点击切换分支

# 克隆我的项目
git clone -b vue3.0-antdv https://github.com/chuzhixin/vue-admin-better.git
# 装置依赖
npm i
# 本地开发 启动我的项目
npm run serve

🌱 vue3.x arco-design 点击切换仓库

# 克隆我的项目
git clone  https://github.com/chuzhixin/vue-admin-arco.git
# 装置依赖
npm i
# 本地开发 启动我的项目
npm run dev

🌱vue2.x master 分支(element-ui)点击切换分支

# 克隆我的项目
git clone -b master https://github.com/chuzhixin/vue-admin-better.git
# 装置依赖
npm i
# 本地开发 启动我的项目
npm run serve

🔊 友情链接

  • OPSLI 基于 vue-admin-better 开源版的最佳实际
  • uView uni-app 生态最优良的 UI 框架
  • form-generator Element 表单设计代码生成器
  • wangEditor 国产最强开源富文本编辑

🙈 咱们承诺将定期资助的开源我的项目(感激伟人)

<img width=”64px” src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/vue.png”/>

<img width=”64px” src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/element-plus.png”/>

<img width=”64px” src=”https://images.opencollective.com/ant-design-vue/2ec179b/logo/256.png”/>

🎨 鸣谢

Project
vue
element-ui
element-plus
ant-design-vue
mock
axios
wangEditor

👷 框架卓越贡献者(排名不分先后)

<img width=”50px” style=”border-radius:999px” src=”https://avatars.githubusercontent.com/u/36689704?s=50″/>

<img width=”50px” style=”border-radius:999px” src=”https://avatars.githubusercontent.com/u/22478003?s=50″/>

<img width=”50px” style=”border-radius:999px” src=”https://avatars.githubusercontent.com/u/29328241?s=50″/>

<img width=”50px” style=”border-radius:999px” src=”https://avatars.githubusercontent.com/u/14859466?s=50″/>

<img width=”50px” style=”border-radius:999px” src=”https://avatars.githubusercontent.com/u/16135960?s=50″/>

📌 劣势及注意事项

 比照其余开源 admin 框架有如下劣势:
1. 反对前端管制路由权限 intelligence、后端管制路由权限 all 模式
2. 已知开源 vue admin 框架中首家反对 mock 主动生成主动导出性能
3. 提供 50 余项全局精细化配置
4. 反对 scss 主动排序,eslint 主动修复
5. axios 精细化封装,反对多数据源、多胜利 code 数组,反对 application/json;charset=UTF-8、application/x-www-form-urlencoded;charset=UTF-8 多种传参形式
6. 反对登录 RSA 加密
7. 反对打包主动生成 7Z 压缩包
8. 反对 errorlog 谬误拦挡
9. 反对多主题、多布局切换

应用注意事项:
1. 我的项目默认应用 lf 换行符而非 crlf 换行符,新建文件时请留神抉择文件换行符
2. 我的项目默认应用的最严格的 eslint 校验标准(plugin:vue/recommended),应用之前倡议配置开发工具实现主动修复(倡议应用 vscode 开发)3. 我的项目应用的是要求最宽泛的 MIT 开源协定,保留 MIT 开源协定即可收费商用

💚 适宜人群

  • 正在以及想应用 element-ui/element-plus 开发,前端开发教训 1 年 +。
  • 相熟 Vue.js 技术栈,应用它开发过几个理论我的项目。
  • 对原理技术感兴趣,想进阶和晋升的同学。

🎉 性能地图

🗃️ 效果图

以下是截取的是 pro 版的效果图展现:

<img src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/2.png”> <img src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/6.png”>
<img src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/8.png”> <img src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/9.png”>
<img src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/3.png”> <img src=”https://fastly.jsdelivr.net/gh/chuzhixin/image/5.png”>

📄 商用注意事项

此我的项目可收费用于商业用途,请恪守 MIT 协定并保留作者技术支持申明。

正文完
 0