# panjiachen/vue-admin-template

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/panjiachen-vue-admin-template).**

20,414 stars · 7,405 forks · JavaScript · MIT

## Links

- GitHub: https://github.com/PanJiaChen/vue-admin-template
- Homepage: https://git.io/fAnuM
- awesome-repositories: https://awesome-repositories.com/repository/panjiachen-vue-admin-template.md

## Topics

`axios` `element-ui` `javascript` `vue` `vue-admin` `vue-cli` `vue-router` `vuex`

## Description

vue-admin-template is a boilerplate for building administrative interfaces using Vue.js. It provides a pre-configured layout, routing, and state management to bootstrap admin dashboards.

The project includes a role-based access control system to restrict menu visibility and route access based on user permissions. It features a component scaffolding tool for generating boilerplate views and business components from templates, as well as an automated SVG icon management system for registering and rendering vector graphics.

The template covers data management through Excel import and export utilities, as well as content authoring with Markdown and rich text editor integration. It provides UI components for paginated navigation, hierarchical tree tables, and clipboard interactions. Build-time capabilities include bundle size analysis, SVG optimization, and environment-specific configuration management.

## Tags

### User Interface & Experience

- [Admin Dashboard Templates](https://awesome-repositories.com/f/user-interface-experience/component-utilities/ui-frameworks/component-libraries/ecosystem-specific-libraries/vue-ui-libraries/admin-dashboard-templates.md) — Provides a complete administrative interface boilerplate with pre-configured layouts, routing, and state management for Vue.js.

### Web Development

- [Admin Dashboard Boilerplates](https://awesome-repositories.com/f/web-development/admin-dashboard-boilerplates.md) — Provides a comprehensive boilerplate for building administrative interfaces with pre-configured layouts, routing, and business components.
- [Admin Dashboard Frameworks](https://awesome-repositories.com/f/web-development/admin-dashboard-frameworks.md) — Offers a comprehensive framework for building backend management interfaces with pre-configured layouts and a built-in network client. ([source](https://cdn.jsdelivr.net/gh/panjiachen/vue-admin-template@master/README.md))
- [Centralized State Management](https://awesome-repositories.com/f/web-development/hydration-state-management/browser-side-state-management/centralized-state-management.md) — Implements a centralized state management pattern to synchronize user roles and application settings across decoupled components.

### Security & Cryptography

- [Role-Based Access Control](https://awesome-repositories.com/f/security-cryptography/role-based-access-control.md) — Implements a permission framework that restricts access to navigation menus and application routes based on user roles.
- [Route-Level Access Guards](https://awesome-repositories.com/f/security-cryptography/role-based-access-control/route-level-access-guards.md) — Provides route-level access guards that verify user roles before granting access to specific views.

### Part of an Awesome List

- [Performance and Optimization](https://awesome-repositories.com/f/awesome-lists/devtools/performance-and-optimization.md) — Implements a performance optimization suite for analyzing bundle sizes and optimizing SVG assets.
- [Admin Dashboards](https://awesome-repositories.com/f/awesome-lists/devtools/admin-dashboards.md) — Minimalist admin dashboard starter for Vue.

### Data & Databases

- [Data Import and Export](https://awesome-repositories.com/f/data-databases/data-import-and-export.md) — Handles the movement of structured data between the web application and Excel spreadsheets for import and export.

### Development Tools & Productivity

- [Application Scaffolding](https://awesome-repositories.com/f/development-tools-productivity/application-scaffolding.md) — Provides a mechanism to rapidly generate boilerplate code for views and components to ensure structural consistency.
- [Web Component Scaffolding](https://awesome-repositories.com/f/development-tools-productivity/command-line-scaffolding/web-component-scaffolding.md) — Offers CLI-driven generation of boilerplate code for new views and business components using pre-defined templates. ([source](https://panjiachen.github.io/vue-element-admin-site/feature/script/new.html))
- [Template-Based Code Generators](https://awesome-repositories.com/f/development-tools-productivity/template-based-code-generators.md) — Includes a scaffolding tool that uses pre-defined templates to automatically generate new view components and business logic.
- [UI Component Scaffolders](https://awesome-repositories.com/f/development-tools-productivity/ui-component-scaffolders.md) — Includes a command-line tool for generating the necessary file and folder structures for new UI components.