back to home

vbenjs / vue-vben-admin

A modern vue admin panel built with Vue3, Shadcn UI, Vite, TypeScript, and Monorepo. It's fast!

31,569 stars
8,597 forks
97 issues
VueTypeScriptCSS
Chat with CodebaseArchitecture ScanSecurity AuditExplain Codebase

AI Architecture Analysis

This repository is indexed by RepoMind. By analyzing vbenjs/vue-vben-admin in our AI interface, you can instantly generate complete architecture diagrams, visualize control flows, and perform automated security audits across the entire codebase.

Our Agentic Context Augmented Generation (Agentic CAG) engine loads full source files into context, avoiding the fragmentation of traditional RAG systems. Ask questions about the architecture, dependencies, or specific features to see it in action.

Click here to launch the interactive analysis workspace

Embed this Badge

Showcase RepoMind's analysis directly in your repository's README.

[![Analyzed by RepoMind](https://img.shields.io/badge/Analyzed%20by-RepoMind-4F46E5?style=for-the-badge)](https://repomind-ai.vercel.app/repo/vbenjs/vue-vben-admin)
Preview:Analyzed by RepoMind

Repository Summary (README)

Preview
<div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp"> </a> <br> <br>

license

<h1>Vue Vben Admin</h1> </div>

Quality Gate Status codeql build ci deploy

English | 中文 | 日本語

Introduction

Vue Vben Admin is a free and open source middle and back-end template. Using the latest vue3, vite, 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.

Upgrade Notice

This is the latest version, 5.0, and it is not compatible with previous versions. If you are starting a new project, it is recommended to use the latest version. If you wish to view the old version, please use the v2 branch.

Features

  • Latest Technology Stack: Developed with cutting-edge front-end technologies like Vue 3 and Vite
  • TypeScript: A language for application-scale JavaScript
  • Themes: Multiple theme colors available with customizable options
  • Internationalization: Comprehensive built-in internationalization support
  • Permissions: Built-in solution for dynamic route-based permission generation

Preview

Test Account: vben/123456

<div align="center"> <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview1.png"> <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview2.png"> <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview3.png"> </div>

Use Gitpod

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

Open in Gitpod

Documentation

Document

Install and Use

  1. Get the project code
git clone https://github.com/vbenjs/vue-vben-admin.git
  1. Install dependencies
cd vue-vben-admin
npm i -g corepack
pnpm install
  1. Run
pnpm dev
  1. Build
pnpm build

Change Log

CHANGELOG

How to Contribute

You are very welcome to join! Raise an issue or submit a Pull Request.

Pull Request Process:

  1. Fork the code
  2. Create your branch: git checkout -b feat/xxxx
  3. Submit your changes: git commit -am 'feat(function): add xxxxx'
  4. Push your branch: git push origin feat/xxxx
  5. Submit pull 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.
  • ci Continuous integration
  • types Type definition file changes

Browser Support

The Chrome 80+ browser is recommended for local development

Support modern browsers, not IE

<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="Edge" width="24px" height="24px" /></br>Edge<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" /></br>Firefox<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" /></br>Chrome<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" /></br>Safari
last 2 versionslast 2 versionslast 2 versionslast 2 versions

Maintainer

@Vben

Star History

Star History Chart

Donate

If you think this project is helpful to you, you can help the author buy a cup of coffee to show your support!

donate

<a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aee;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a>

Contributors

<a href="https://openomy.app/github/vbenjs/vue-vben-admin" target="_blank" style="display: block; width: 100%;" align="center"> <img src="https://openomy.app/svg?repo=vbenjs/vue-vben-admin&chart=bubble&latestMonth=3" target="_blank" alt="Contribution Leaderboard" style="display: block; width: 100%;" /> </a> <a href="https://github.com/vbenjs/vue-vben-admin/graphs/contributors"> <img alt="Contributors" src="https://contrib.rocks/image?repo=vbenjs/vue-vben-admin" /> </a>

Discord

License

MIT © Vben-2020