[![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE)

Vue vben admin

English | 中文

Introduction

Vue Vben Admin is a free and open source middle and back-end template. Using the latest vue3, vite2, TypeScript and other mainstream technology development, the out-of-the-box middle and back-end front-end solutions can also be used for learning reference.

Feature

State of The Art Development：Use front-end front-end technology development such as Vue3/vite2
TypeScript: Application-level JavaScript language
Theming: Configurable themes
International：Built-in complete internationalization program
Mock Server Built-in mock data scheme
Authority Built-in complete dynamic routing permission generation scheme.
Component Multiple commonly used components are encapsulated twice

Preview

vue-vben-admin - Full version Chinese site
vue-vben-admin-gh-pages - Full version of the github site
vben-admin-thin-next - Simplified Chinese site
vben-admin-thin-gh-pages -Simplified github site

Test account: vben/123456

VbenAdmin Logo

Use Gitpod

Open the project in Gitpod (free online dev environment for GitHub) and start coding immediately.

Documentation

Document

Preparation

node and git - Project development environment
Vite - Familiar with vite features
Vue3 - Familiar with Vue basic syntax
TypeScript - Familiar with the basic syntax of TypeScript
Es6+ - Familiar with es6 basic syntax
Vue-Router-Next - Familiar with the basic use of vue-router
Ant-Design-Vue - ui basic use
Mock.js - mockjs basic syntax

Install and use

Get the project code

git clone https://github.com/anncwb/vue-vben-admin.git

Installation dependencies

cd vue-vben-admin

pnpm install

pnpm serve

build

pnpm build

Change Log

CHANGELOG

Project

vue-vben-admin - full version
vue-vben-admin-thin-next - Simplified version

How to contribute

You are very welcome to join！Raise an issue Or submit a Pull Request。

Pull Request:

Fork code!
Create your own branch: git checkout -b feat/xxxx
Submit your changes: git commit -am 'feat(function): add xxxxx'
Push your branch: git push origin feat/xxxx
submitpull request

Git Contribution submission specification

reference vue specification (Angular)
- feat Add new features
- fix Fix the problem/BUG
- style The code style is related and does not affect the running result
- perf Optimization/performance improvement
- refactor Refactor
- revert Undo edit
- test Test related
- docs Documentation/notes
- chore Dependency update/scaffolding configuration modification etc.
- workflow Workflow improvements
- ci Continuous integration
- types Type definition file changes
- wip In development

Related warehouse

If these plugins are helpful to you, you can give a star support

vite-plugin-mock - Used for local and development environment data mock
vite-plugin-html - Used for html template conversion and compression
vite-plugin-style-import - Used for component library style introduction on demand
vite-plugin-theme - Used for online switching of theme colors and other color-related configurations
vite-plugin-imagemin - Used to pack compressed image resources
vite-plugin-compression - Used to pack input .gz|.brotil files
vite-plugin-svg-icons - Used to quickly generate svg sprite