# vue-admin-beautiful

**Repository Path**: getjava/vue-admin-beautiful

## Basic Information

- **Project Name**: vue-admin-beautiful
- **Description**: 🚀🚀🚀vue-admin-beautiful是github开源admin中最优秀的集成框架之一，它是国内首个基于vue3.0的开源admin项目，同时支持电脑，手机，平板，🔥🔥🔥默认分支使用vue3.x+antdv开发，master分支使用的是vue2.x+element开发
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: https://chu1204505056.gitee.io/vue-admin-beautiful
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 883
- **Created**: 2020-11-26
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

#

<div align="center"><img width="200" src="https://gitee.com/chu1204505056/vue-admin-beautiful/raw/master/src/colorfulIcon/svg/vab.svg"/>
<h1> vue-admin-beautiful（element-ui） </h1>
</div>

## 地址

- [🎉 vue2.x + element-ui（免费商用，支持 PC、平板、手机）](http://beautiful.panm.cn/vue-admin-beautiful-element/?hmsr=github&hmpl=&hmcu=&hmkw=&hmci=)

- [⚡️ vue3.x + ant-design-vue（beta 版本，免费商用，支持 PC、平板、手机）](http://beautiful.panm.cn/vue-admin-beautiful-antdv/?hmsr=github&hmpl=&hmcu=&hmkw=&hmci=)

- [🚀 pro 版演示地址（付费版本，支持 PC、平板、手机）](http://beautiful.panm.cn/vue-admin-beautiful-pro/?hmsr=github&hmpl=&hmcu=&hmkw=&hmci=)

- [🌐 github 仓库地址](https://github.com/chuzhixin/vue-admin-beautiful/?hmsr=github&hmpl=&hmcu=&hmkw=&hmci=)

- [🌐 码云仓库地址](https://gitee.com/chu1204505056/vue-admin-beautiful/?hmsr=github&hmpl=&hmcu=&hmkw=&hmci=)

## 备份地址（以上地址无法使用时请访问备份站）

- [🎉 vue2.x + element-ui（免费商用，支持 PC、平板、手机）](https://chu1204505056.gitee.io/vue-admin-beautiful-element/?hmsr=github&hmpl=&hmcu=&hmkw=&hmci=)

- [⚡️ vue3.x + ant-design-vue（beta 版本，免费商用，支持 PC、平板、手机）](https://chu1204505056.gitee.io/vue-admin-beautiful-mini/?hmsr=github&hmpl=&hmcu=&hmkw=&hmci=)

- [🚀 pro 版演示地址（付费版本，支持 PC、平板、手机）](https://chu1204505056.gitee.io/vue-admin-beautiful-pro/?hmsr=github&hmpl=&hmcu=&hmkw=&hmci=)

## 🌱 vue3.x vue3.0-antdv 分支（ant-design-vue）[点击切换分支](https://github.com/chuzhixin/vue-admin-beautiful/tree/vue3.0-antdv)

```bash
# 克隆项目
git clone -b vue3.0-antdv https://github.com/chuzhixin/vue-admin-beautiful.git
# 进入项目目录
cd vue-admin-beautiful
# 安装依赖
npm i
# 本地开发 启动项目
npm run serve
```

## 🌱vue2.x master 分支（element-ui）[点击切换分支](https://github.com/chuzhixin/vue-admin-beautiful/tree/master)

```bash
# 克隆项目
git clone -b master https://github.com/chuzhixin/vue-admin-beautiful.git
# 进入项目目录
cd vue-admin-beautiful
# 安装依赖
npm i
# 本地开发 启动项目
npm run serve
```

## vue-admin-beautiful 前端讨论 QQ 群 972435319，1139183756

不管您加或者不加，您都可以享受到开源的代码，感谢您的支持和信任，群内提供 vue-admin-beautifu 基础版本、开发工具自动配置教程及项目开发文档。

<a>![img](https://gitee.com/chu1204505056/image/raw/master/ewm.png)</a>
<a>![img](https://gitee.com/chu1204505056/image/raw/master/ewm_2.png)</a>

## 友情链接

- [uView 文档（超棒的移动跨端框架，文档详细，上手容易）](https://uviewui.com/)

- [uView 开源地址（uni-app 生态优秀的 UI 框架，全面的组件和便捷的工具会让您信手拈来，如鱼得水）](https://github.com/YanxinNet/uView/)

- [Element UI 表单设计及代码生成器（可视化表单设计器，一键生成 element 表单）](https://github.com/JakHuang/form-generator/)

- [luch-request（基于 Promise 开发的 uni-app 跨平台、项目级别的请求库）](https://www.quanzhan.co/luch-request/)

- [umyui](http://www.umyui.com/)

## 我们承诺将定期赞助的开源项目（感谢巨人）

<a title="vue" href="https://cn.vuejs.org/" target="_blank">
<img width="64px" src="https://gitee.com/chu1204505056/image/raw/master/vue.png"/>
</a>

<a title="ant-design-vue" href="https://github.com/vueComponent/ant-design-vue#backers" target="_blank">
<img width="64px" src="https://gitee.com/chu1204505056/image/raw/master/antdv.svg"/>
</a>

<a title="element-plus" href="https://github.com/element-plus/element-plus" target="_blank">
<img width="64px" src="https://gitee.com/chu1204505056/image/raw/master/element-plus.png"/>
</a>

## 鸣谢

| Project                                                              |
| -------------------------------------------------------------------- |
| [vue](https://github.com/vuejs/vue)                                  |
| [element-ui](https://github.com/ElemeFE/element)                     |
| [element-plus](https://github.com/element-plus/element-plus)         |
| [ant-design-vue](https://github.com/vueComponent/ant-design-vue)     |
| [mock](https://github.com/nuysoft/Mock)                              |
| [axios](https://github.com/axios/axios)                              |
| [vue-element-admin](https://github.com/PanJiaChen/vue-element-admin) |
| [iview-admin](https://github.com/iview/iview-admin)                  |

## 框架杰出贡献者（排名不分先后）

<a href="https://github.com/buuing" target="_blank">
<img style="border-radius:999px" src="https://avatars1.githubusercontent.com/u/36689704?s=50&u=7a4049f10010a115b8dd35f159bb81726bc0ac20&v=4"/>
</a>
<a href="https://github.com/hipi" target="_blank">
<img style="border-radius:999px" src="https://avatars1.githubusercontent.com/u/22478003?s=50&u=121126473328c04cbf3cff5516110814ca1010e4&v=4"/>
</a>
<a href="https://github.com/fwfmiao" target="_blank">
<img style="border-radius:999px" src="https://avatars3.githubusercontent.com/u/29328241?s=50&u=bb0977b405ccf1a101ce4e18e4fb8d958854ca60&v=4"/>
</a>

## 谁在使用

- 如果您正在使用 vue-admin-beautiful 希望展示或不展示到 README 中请联系1204505056@qq.com添加或去除

  <a title="360数科" href="https://www.360shuke.com/" target="_blank">
  <img width="120px" src="https://gitee.com/chu1204505056/image/raw/master/360.png"/>
  </a>
  <br/>
  <a title="京东" href="https://www.jd.com/" target="_blank">
  <img width="120px" src="https://gitee.com/chu1204505056/image/raw/master/jingdong.png"/>
  </a>
  <br/>
  <a title="uview" href="https://www.uviewui.com/" target="_blank">
  <img width="120px" src="https://gitee.com/chu1204505056/image/raw/master/uview.png"/>
  </a>
  <br/>
  <a title="千鸟云商" href="https://www.qianniao.vip/#/login" target="_blank">
  <img width="120px" src="https://gitee.com/chu1204505056/image/raw/master/qianniaoyunshang.png"/>
  </a>
  <br/>
  <a title="OPSLI" href="https://www.opsli.com/" target="_blank">
  <img width="120px" src="https://gitee.com/chu1204505056/image/raw/master/opsli.png"/>
  </a>

## 优势及注意事项

```
vue-admin-beautiful 对比其他开源 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. 支持多主题、多布局切换

vue-admin-beautiful 使用注意事项:
1. 项目默认使用lf换行符而非crlf换行符，新建文件时请注意选择文件换行符
2. 项目默认使用的最严格的eslint校验规范（plugin:vue/recommended），使用之前建议配置开发工具实现自动修复（建议使用vscode开发）
3. 项目使用的是要求最宽泛的MIT开源协议，保留MIT开源协议即可免费商用

```