< p align = "center" >
< img width = "320" src = "https://wpimg.wallstcn.com/ecc53a42-d79b-42e2-8852-5126b810a4c8.svg" >
< / p >
< p align = "center" >
< a href = "https://github.com/vuejs/vue" >
< img src = "https://img.shields.io/badge/vue-2.5.10-brightgreen.svg" alt = "vue" >
< / a >
< a href = "https://github.com/ElemeFE/element" >
< img src = "https://img.shields.io/badge/element--ui-2.3.2-brightgreen.svg" alt = "element-ui" >
< / a >
< a href = "https://travis-ci.org/PanJiaChen/vue-element-admin" rel = "nofollow" >
< img src = "https://travis-ci.org/PanJiaChen/vue-element-admin.svg?branch=master" alt = "Build Status" >
< / a >
< a href = "https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE" >
< img src = "https://img.shields.io/github/license/mashape/apistatus.svg" alt = "license" >
< / a >
< a href = "https://github.com/PanJiaChen/vue-element-admin/releases" >
< img src = "https://img.shields.io/github/release/PanJiaChen/vue-element-admin.svg" alt = "GitHub release" >
< / a >
< / p >
English | [简体中文 ](./README.zh-CN.md )
## Introduction
[vue-element-admin ](http://panjiachen.github.io/vue-element-admin ) is a front-end management background integration solution. It based on [vue ](https://github.com/vuejs/vue ) and use the UI Toolkit [element ](https://github.com/ElemeFE/element ).
It is a magical vue admin based on the newest development stack of vue, built-in i18n solution, typical templates for enterprise applications, lots of awesome features. It helps you build a large complex Single-Page Applications. I believe whatever your needs are, this project will help you.
- [Preview ](http://panjiachen.github.io/vue-element-admin )
- [Documentation ](https://panjiachen.github.io/vue-element-admin-site/ )
- [Gitter ](https://gitter.im/vue-element-admin/discuss )
- [Wiki ](https://github.com/PanJiaChen/vue-element-admin/wiki )
- [Donate ](https://panjiachen.github.io/vue-element-admin-site/donate/ )
- [Gitee ](https://panjiachen.gitee.io/vue-element-admin/ ) 国内用户可访问该地址在线预览
**This project is positioned as a background integration solution and is not suitable for secondary development as a basic template.**
- Base template recommends using: [vueAdmin-template ](https://github.com/PanJiaChen/vueAdmin-template )
- Desktop: [electron-vue-admin ](https://github.com/PanJiaChen/electron-vue-admin )
## Preparation
You need to install [node ](http://nodejs.org/ ) and [git ](https://git-scm.com/ ) locally. The project is based on [ES2015+ ](http://es6.ruanyifeng.com/ ), [vue ](https://cn.vuejs.org/index.html ), [vuex ](https://vuex.vuejs.org/zh-cn/ ), [vue-router ](https://router.vuejs.org/zh-cn/ ), [axios ](https://github.com/axios/axios ) and [element-ui ](https://github.com/ElemeFE/element ), all request data is simulated using [Mock.js ](https://github.com/nuysoft/Mock ).
Understanding and learning this knowledge in advance will greatly help the use of this project.
**This project does not support low version browsers (e.g. IE). Please add polyfill yourself if you need them.**
**Note: This project uses element-ui@2.3.0+ version, so the minimum compatible vue@2.5.0+**
< p align = "center" >
< img width = "900" src = "https://wpimg.wallstcn.com/a5894c1b-f6af-456e-82df-1151da0839bf.png" >
< / p >
## Features
```
- Login / Logout
- Permission Authentication
- Page permission
- Directive permission
- Two-step login
- Multi-environment build
- dev sit stage prod
- Global Features
- I18n
- Multiple dynamic themes
- Dynamic sidebar (supports multi-level routing)
- Dynamic breadcrumb
- Tags-view(Tab page Support right-click operation)
- Svg Sprite
- Mock data
- Screenfull
- Responsive Sidebar
- Editor
- Rich Text Editor
- Markdown Editor
- JSON Editor
- Excel
- Export Excel
- Export zip
- Upload Excel
- Visualization Excel
- Table
- Dynamic Table
- Drag And Drop Table
- Tree Table
- Inline Edit Table
- Error Page
- 401
- 404
- Components
- Avatar Upload
- Back To Top
- Drag Dialog
- Drag Kanban
- Drag List
- SplitPane
- Dropzone
- Sticky
- CountTo
- Advanced Example
- Error Log
- Dashboard
- Guide Page
- Echarts
- Clipboard
- Markdown to html
```
## Getting started
```bash
# clone the project
git clone https://github.com/PanJiaChen/vue-element-admin.git
# install dependency
npm install
# develop
npm run dev
```
This will automatically open http://localhost:9527.
## Build
```bash
# build for test environment
npm run build:sit
# build for production environment
npm run build:prod
```
## Advanced
```bash
# --report to build with bundle size analytics
npm run build:prod --report
# --generate a bundle size analytics. default: bundle-report.html
npm run build:prod --generate_report
# --preview to start a server in local to preview
npm run build:prod --preview
# lint code
npm run lint
# auto fix
npm run lint -- --fix
```
Refer to [Documentation ](https://panjiachen.github.io/vue-element-admin-site/guide/essentials/deploy.html ) for more information
## Changelog
Detailed changes for each release are documented in the [release notes ](https://github.com/PanJiaChen/vue-element-admin/releases ).
## Online Demo
[Preview ](http://panjiachen.github.io/vue-element-admin )
## Donate
If you find this project useful, you can buy author a glass of juice :tropical_drink:
![donate ](https://wpimg.wallstcn.com/bd273f0d-83a0-4ef2-92e1-9ac8ed3746b9.png )
[Paypal Me ](https://www.paypal.me/panfree23 )
[Buy me a coffee ](https://www.buymeacoffee.com/Pan )
## License
[MIT ](https://github.com/PanJiaChen/vue-element-admin/blob/master/LICENSE )
Copyright (c) 2017-present PanJiaChen