back to home

PanJiaChen / vue-admin-template

a vue2.0 minimal admin template

20,470 stars
7,456 forks
321 issues
JavaScriptVueSCSS
Chat with CodebaseArchitecture ScanSecurity AuditExplain Codebase

AI Architecture Analysis

This repository is indexed by RepoMind. By analyzing PanJiaChen/vue-admin-template 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/PanJiaChen/vue-admin-template)
Preview:Analyzed by RepoMind

Repository Summary (README)

Preview

vue-admin-template

English | 简体中文

A minimal vue admin template with Element UI & axios & iconfont & permission control & lint

Live demo: http://panjiachen.github.io/vue-admin-template

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

<p align="center"> <b>SPONSORED BY</b> </p> <p align="center"> <a href="https://finclip.com?from=vue_element" title="FinClip" target="_blank"> <img height="200px" src="https://gitee.com/panjiachen/gitee-cdn/raw/master/vue%E8%B5%9E%E5%8A%A9.png" title="FinClip"> </a> </p>

Build Setup

# clone the project
git clone https://github.com/PanJiaChen/vue-admin-template.git

# enter the project directory
cd vue-admin-template

# install dependency
npm install

# develop
npm run dev

This will automatically open http://localhost:9528

Build

# build for test environment
npm run build:stage

# build for production environment
npm run build:prod

Advanced

# preview the release environment effect
npm run preview

# preview the release environment effect + static resource analysis
npm run preview -- --report

# code format check
npm run lint

# code format check and auto fix
npm run lint -- --fix

Refer to Documentation for more information

Demo

demo

Extra

If you want router permission && generate menu by user roles , you can use this branch permission-control

For typescript version, you can use vue-typescript-admin-template (Credits: @Armour)

Related Project

Browsers support

Modern browsers and Internet Explorer 10+.

<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" /></br>IE / 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
IE10, IE11, Edgelast 2 versionslast 2 versionslast 2 versions

License

MIT license.

Copyright (c) 2017-present PanJiaChen