vue3-antdv-admin

vue3-antdv-admin is an open-source admin dashboard boilerplate built on Vite 5.x, Vue 3.x, Ant Design Vue 4.x, and TypeScript 5.x, designed to give developers a complete back-office foundation with role-based access control and dynamic UI generation. It ships with a demo login (admin / a123456), an online preview, project documentation, Swagger API docs, and a companion NestJS backend repository, so it covers both front-end and API scaffolding.

What is vue3-antdv-admin?

Vue3-antdv-admin is a backend management system template that combines the Vite 5.x build tool, Vue 3.x Composition API, Ant Design Vue 4.x component library, and TypeScript 5.x. It takes a cloned repository and produces a runnable admin panel app with login, role-based menu permissions, dynamic forms, dynamic tables, and a lock-screen function. The project is maintained by a Chinese developer (buqiyuan) and distributed through GitHub and Gitee, with a separate NestJS backend repository and Swagger documentation.

Key Features

• RBAC permission system — Role-based access control lets you define roles and permissions; the demo account admin / a123456 logs into the online preview at buqiyuan.gitee.io.
• JSON Schema dynamic forms — Generate forms from JSON Schema definitions instead of hand-writing form fields, with a dynamic form module marked as actively developed.
• Dynamic table — A configurable table component under active development for rendering grid data without repetitive markup.
• Lock screen — Built-in lock-screen UI feature that suspends the session behind a re-authentication prompt.
• Mock support — The repository topics include mock integration so front-end development can run without a live API.
• TSX support — TypeScript and TSX rendering are enabled for writing Vue 3 components with the Composition API.
• Vite 5 + Vue 3 + antd 4 stack — Uses pnpm for dependency management; commands are pnpm dev for development and pnpm build for production builds.
• Documentation and API — Includes a project documentation site, a Swagger endpoint at nest-api.buqiyuan.site/api-docs, and a companion Nest admin backend on GitHub.

Who is it for?

• Front-end developers — Use this template as a starting point for building a Vue 3 + TypeScript admin console instead of configuring Vite, routing, state, and UI library from scratch.
• Full-stack teams — Pair the front-end with the provided NestJS backend and Swagger API to develop a permission-controlled management system end to end.
• Developers learning Vue 3 Composition API — Study the codebase to see hooks-based logic composition, which the README highlights as more flexible than Vue 2 Options API mixins.

What can you do with vue3-antdv-admin?

• Admin system developers: scaffold an authenticated back-office with a prebuilt login, role-based menus, and page layouts using Ant Design Vue components.
• API-driven teams: connect the admin UI to the Swagger-documented NestJS API and manage data through dynamic forms and dynamic tables.
• Prototype builders: use the JSON Schema dynamic form and mock support to validate form-heavy workflows before a real backend is ready.

How does vue3-antdv-admin work?

1. Clone the repository from https://github.com/buqiyuan/vue3-antdv-admin.
2. Install dependencies with pnpm install.
3. Start the dev server with pnpm dev or produce a production bundle with pnpm build.
4. Log in with the seeded demo account (admin / a123456) in the online preview to explore the RBAC menu structure.

FAQ

Is vue3-antdv-admin free?

Yes, the project is publicly hosted on GitHub and Gitee and can be cloned without payment; the repository accepts voluntary donations via WeChat and Alipay for the author.

What login credentials does the demo use?

The online preview can be accessed with account admin and password a123456. The same account is the default seed login for the system.

What technology stack does it use?

The front-end is built with Vite 5.x, Vue 3.x, Ant Design Vue 4.x, and TypeScript 5.x, and uses pnpm as the package manager. The README also lists vue-router and vuex in the repository topics.

Does it include a backend?

Yes, the README links to a companion backend repository nest-admin on GitHub and a Swagger API documentation endpoint, so you can run the API side yourself.

What features are still in progress?

The project roadmap lists dynamic tables and dynamic forms as implemented but still being refined, while e-commerce SKU demo and pure front-end PDF export with dynamic pagination are marked as not yet completed.