Admin frontend template built with Vue 3, Vite, Pinia, and Element Plus
admin-element-vue — Vue Admin dashboard Template
By lqsong
A Vue 3, Vite, Pinia, and Element Plus admin frontend template with built-in dynamic routing, permission verification, internationalization, and mock data.
Explore the design
Compare the page layouts and mobile experience. Open any screenshot for a closer look.
Actual screenshot captured by the server browser.
All pages & views 2
Screenshots show visual appearance; interactive behavior may differ.
What stands out
A quick read of the recorded project description.
Built-in dynamic routing and permission verification
Supports internationalization and mock data
Provides both webpack and Vite version branches
Includes an online demo and usage documentation
Code is under the MIT license, allowing commercial use and distribution
Template Details
The vite.ts2 branch of admin-element-vue is an admin frontend solution built on the Frame-Template-Vue framework and Element Plus UI components. It combines Vue 3, Vite, Pinia, and Element Plus, and provides capabilities such as dynamic routing, permission verification, internationalization, and mock data. The repository also offers a webpack version; this branch is the Vite + Vue 3 + Pinia + Element Plus version.
The template includes an online demo and usage documentation. The demo environment uses an online mock service, and the README notes that this service is unstable; if online login fails, you can pull the code locally and run it directly to view it. The project requires pnpm for dependency installation and local development.
The code is under the MIT license and can be used, modified, commercialized, and distributed for free, but third-party assets such as demo images, fonts, and icons must be checked separately under their respective licenses, and external services such as domains, hosting, and databases may incur separate charges.
Is it right for your project?
Use Cases
- Building an admin management interface that requires login and permission control
- Introducing the Element Plus component library as a UI foundation in a Vue 3 project
- Admin frontend development that needs dynamic routing and internationalization support
- Using mock data for early integration during frontend-backend separated development
Suitable For
- Frontend developers using the Vue 3 and Element Plus stack
- Frontend teams that need an admin template to quickly start a project
- Developers who want to reference implementations of dynamic routing, permission verification, and internationalization
Getting started & customization
Use these recorded setup notes alongside the repository instructions for your chosen version.
- 1
The project requires pnpm to install dependencies; run pnpm i and then pnpm dev to start local development
- 2
The online demo uses an online mock service, which the README notes is unstable; if login fails, pull the code locally and run it
- 3
Before use, check the licenses of third-party assets such as demo images, fonts, and icons; do not judge solely based on the code's MIT license
- 4
When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice
License & source material
Usage conditions & limitations
Free to use · keep license noticeThis entry covers the free version under the MIT license in the public repository; the free scope applies to that version's code and does not mean external services or third-party assets are free.
Must comply with when using
- The code of this version may be used, modified, commercialized, and distributed for free.
- When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
- The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.
Additional costs & items to verify
- Demo images, fonts, icons, and other third-party assets must be checked under their respective licenses; do not judge solely based on the code's MIT license.
- External services such as domains, hosting, databases, payments, or AI may incur separate charges.
- The online demo relies on an online mock service, and the README explicitly states that this service is unstable; if online login fails, you need to pull the code locally and run it to view the demo.
- The project requires pnpm as the package manager for dependency installation and local development; otherwise, installation or running may fail.
View Original Text Basis
Permission is hereby granted, free of charge
Original License Text
**注意:Demo 用的是在线 mock 服务,不稳定,若在线登录不了 pull 到本地可直接运行查看 demo**
Original README
https://github.com/lqsong/admin-element-vue/blob/vite.ts2/LICENSEhttps://github.com/lqsong/admin-element-vue/blob/vite.ts2/README.md> 请使用 pnpm , **[pnpm 的安装与使用](http://liqingsong.cc/article/detail/26)** 。
Original README
Compiled by DeepSeek based on repository license and README ·2026-10-08. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.
Project checks & description sources
Template Information
- Source platforms
- GitHub
- Documentation and maintenance reference score
- More documented · 81 / 100
- Technologies
- Vue · Vite
- Website type
- Admin dashboard
How this score is calculated
Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.
What to verify for this project
- Repository update recorded
- 2024-04-19
- Screenshot last checked
- 2026-10-08
A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.
The catalog identifies Vue as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.
Use a selection guide →How this description was prepared
AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.
Review declaration: [email protected] · 2026-10-08
Inspect the recorded source material
SHA-256: 00253d1ed1384bcfccb1c2a31a37a12a1195a9f5cb7ff13dbc437107d716ac7d
2026-10-08T12:39:05.548Z
Source file / repository# admin-element-vue-vite-ts2 此分支是 Vite + Vue3.x + Pinia + Element Plus 版本 , 其他版本请点击其他分支查看。 `admin-element-vue-vite-ts2` 是一个后台前端解决方案,它基于[Frame-Template-Vue](http://frame-template-vue.liqingsong.cc/)框架 、[Element Plus](https://github.com/element-plus/element-plus) UI 组件实现。它使用了最新的前端技术栈、动态路由、权限验证、国际化、Mock 数据等。 ## Demo **注意:Demo 用的是在线 mock 服务,不稳定,若在线登录不了 pull 到本地可直接运行查看 demo** | **[Demo(点击此处)](http://vitets2-demo.admin-element-vue.liqingsong.cc/)** | :-------------------------: |  | |  | |  | |  | |  | |  | ## 使用文档 - [http://admin-element-vue.liqingsong.cc/vitets2/](http://admin-element-vue.liqingsong.cc/vitets2/) - [Github](https://github.com/lqsong/admin-element-vue) - [Gitee](https://gitee.com/lqsong/admin-element-vue) ## 框架模板 - frame-template-vue([GitHub](https://github.com/lqsong/frame-template-vue)、[Gitee](https://gitee.com/lqsong/frame-template-vue)) ## 后台前端解决方案列表 - admin-element-vue([GitHub](https://github.com/lqsong/admin-element-vue)、[Gitee](https://gitee.com/lqsong/admin-element-vue)) - admin-antd-vue([GitHub](https://github.com/lqsong/admin-antd-vue)、[Gitee](https://gitee.com/lqsong/admin-antd-vue)) - admin-antd-react([GitHub](https://github.com/lqsong/admin-antd-react)、[Gitee](https://gitee.com/lqsong/admin-antd-react)) - electron-admin-element-vue([GitHub](https://github.com/lqsong/electron-admin-element-vue)、[Gitee](https://gitee.com/lqsong/electron-admin-element-vue)) - electron-admin-antd-vue([GitHub](https://github.com/lqsong/electron-admin-antd-vue)、[Gitee](https://gitee.com/lqsong/electron-admin-antd-vue)) - electron-admin-antd-react([GitHub](https://github.com/lqsong/electron-admin-antd-react)、[Gitee](https://gitee.com/lqsong/electron-admin-antd-react)) - admin-vue3-micro-qiankun([GitHub](https://github.com/lqsong/admin-vue3-micro-qiankun)、[Gitee](https://gitee.com/lqsong/admin-vue3-micro-qiankun)) ## 前台前端解决方案列表 - template-vant-vue([GitHub](https://github.com/lqsong/template-vant-vue)、[Gitee](https://gitee.com/lqsong/template-vant-vue)) ## 前台前端 SSR 解决方案列表 - midway-vue3-ssr([GitHub](https://github.com/lqsong/midway-vue3-ssr)、[Gitee](https://gitee.com/lqsong/midway-vue3-ssr)) - midway-react-ssr([GitHub](https://github.com/lqsong/midway-react-ssr)、[Gitee](https://gitee.com/lqsong/midway-react-ssr)) ## 快速入门 > 请使用 pnpm , **[pnpm 的安装与使用](http://liqingsong.cc/article/detail/26)** 。 ### 本地开发 ```bash $ pnpm i $ pnpm dev ``` ## 捐赠 如果你觉得这个项目帮助到了你,请帮助点击 Star,你也可以请作者喝咖啡表示鼓励. | **ALIPAY** | **WECHAT** | | :---------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------: | |  |  |
Explore similar templates
Compare previews and descriptions within the same stack and category.

vuestic-admin
Vuestic Admin is an open-source Vue 3 admin template maintained by Epicmax, built on Vuestic UI with Vite, Pinia, and Tailwind CSS. It provides a ready-to-run dashboard with a dark theme, global configuration, i18n internationalization, and responsive layout.
Vue · Admin dashboard

v3-admin-vite
v3-admin-vite is an AI-friendly Vue3 admin template built on Vue3, Vite, TypeScript, and Element Plus. It keeps a lean structure with detailed comments, supports backend-controlled dynamic route permissions, page-level and button-level permissions, multiple themes and layouts, and mobile compatibility.
Vue · Admin dashboard

vue-typescript-admin-template
A Vue 2.6 + TypeScript + Element UI admin template ported from vue-element-admin, offering type safety and enterprise features like permission authentication, internationalization, dynamic themes, editors, charts, Excel/PDF handling, and PWA support.
Vue · Admin dashboard

vue-antd-admin
Vue Antd Admin is the Vue implementation of Ant Design Pro, providing an out-of-the-box front-end and design solution for admin dashboards.
Vue · Admin dashboard

coreui-free-vue-admin-template
CoreUI's official free Vue admin template, MIT licensed, built on Vue 3 and the CoreUI component library with Vue Router, Pinia, and Vite.
Vue · Admin dashboard

nova-admin
Nova Admin is an admin template built on Vue3, Vite, TypeScript, and Naive UI, with Unocss for styling.
Vue · Admin dashboard
