/vue-element-admin

:zap: 中后台解决方案

Primary LanguageJavaScriptMIT LicenseMIT

vue element-ui Build Status license GitHub release gitter donate

简介

vue-element-admin 是一个后台前端解决方案,它基于 vueelement-ui实现,采用前沿的前端技术栈,内置了 i18n 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,快速搭建企业级中后台产品原型。

After the v4.1.0+ version, the default master branch will not support i18n. Please use i18n Branch, it will keep up with the master update

The current version is v4.0+ build on vue-cli. If you find a problem, please put issue. If you want to use the old version , you can switch branch to tag/3.11.0, it does not rely on vue-cli

This project does not support low version browsers (e.g. IE). Please add polyfill by yourself.

Preparation

You need to install node and git locally. The project is based on ES2015+, vue, vuex, vue-router, vue-cli , axios and element-ui, all request data is simulated using Mock.js. Understanding and learning this knowledge in advance will greatly help the use of this project.

Edit on CodeSandbox

前序准备

你需要在本地安装 nodegit。本项目技术栈基于 ES2015+vuevuexvue-routervue-cliaxioselement-ui,所有的请求数据都使用Mock.js进行模拟,提前了解和学习这些知识会对使用本项目有很大的帮助。

功能

- 登录 / 注销

- 权限验证
  - 页面权限
  - 指令权限
  - 权限配置
  - 二步登录

- 多环境发布
  - dev sit stage prod

- 全局功能
  - 国际化多语言
  - 多种动态换肤
  - 动态侧边栏(支持多级路由嵌套)
  - 动态面包屑
  - 快捷导航(标签页)
  - Svg Sprite 图标
  - 本地/后端 mock 数据
  - Screenfull全屏
  - 自适应收缩侧边栏

- 编辑器
  - 富文本
  - Markdown
  - JSON 等多格式

- Excel
  - 导出excel
  - 导入excel
  - 前端可视化excel
  - 导出zip

- 表格
  - 动态表格
  - 拖拽表格
  - 内联编辑

- 错误页面
  - 401
  - 404

- 組件
  - 头像上传
  - 返回顶部
  - 拖拽Dialog
  - 拖拽Select
  - 拖拽看板
  - 列表拖拽
  - SplitPane
  - Dropzone
  - Sticky
  - CountTo

- 综合实例
- 错误日志
- Dashboard
- 引导页
- ECharts 图表
- Clipboard(剪贴复制)
- Markdown2html

开发

# 克隆项目
git clone git@github.com:SeanKChan/vue-element-admin.git

# 进入项目目录
cd vue-element-admin

# 安装依赖
npm install

# 建议不要直接使用 cnpm 安装以来,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org

# 启动服务
npm run dev

浏览器访问 http://localhost:9527

发布

# 构建测试环境
npm run build:stage

# 构建生产环境
npm run build:prod

其它

# 预览发布环境效果
npm run preview

# 预览发布环境效果 + 静态资源分析
npm run preview -- --report

# 代码格式检查
npm run lint

# 代码格式检查并自动修复
npm run lint -- --fix

更多信息请参考 使用文档

Browsers support

Modern browsers and Internet Explorer 10+.

IE / Edge
IE / Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
IE10, IE11, Edge last 2 versions last 2 versions last 2 versions

License

MIT

Copyright (c) 2017-present PanJiaChen