15.1K ·GitHub
What is this?
SoybeanAdmin is a clean, elegant and feature-rich admin template for Vue3 — a ready-made dashboard boilerplate built on Vite, TypeScript, Pinia, NaiveUI and UnoCSS that works out of the box.
SoybeanAdmin is a clean, elegant and feature-rich admin template for Vue3 — a ready-made dashboard boilerplate built on Vite, TypeScript, Pinia, NaiveUI and UnoCSS that works out of the box.So is it a finished app I deploy, or a codebase I build my own project on?It is a template codebase, not a hosted app: you clone the pnpm monorepo and customize it into your own management system. It also doubles as a best-practice reference for learning the modern Vue stack.
It is a template codebase, not a hosted app: you clone the pnpm monorepo and customize it into your own management system. It also doubles as a best-practice reference for learning the modern Vue stack.How do I get it running locally?Clone the repo, run pnpm install, then pnpm dev to start the Vite dev server; pnpm build produces a production build.
Clone the repo, run pnpm install, then pnpm dev to start the Vite dev server; pnpm build produces a production build.What do I need installed before that?Git, Node.js >= 20.19.0 and pnpm >= 10.5.0 — and pnpm specifically: npm and yarn are explicitly off-limits because the project is managed as a pnpm monorepo.
Git, Node.js >= 20.19.0 and pnpm >= 10.5.0 — and pnpm specifically: npm and yarn are explicitly off-limits because the project is managed as a pnpm monorepo.Does it work in older browsers?No legacy support: IE is not supported, the target is the last two versions of modern browsers, and the README recommends developing in the latest Chrome.
No legacy support: IE is not supported, the target is the last two versions of modern browsers, and the README recommends developing in the latest Chrome.What does it include out of the box?Rich theme configuration integrated with UnoCSS, built-in i18n, an automated file-based routing system (Elegant Router), permission routing with both static front-end and dynamic back-end routes, ready-made 403/404/500 pages, layout and tab components, mobile-adaptive layout, and a built-in CLI for git commits and releases.
Rich theme configuration integrated with UnoCSS, built-in i18n, an automated file-based routing system (Elegant Router), permission routing with both static front-end and dynamic back-end routes, ready-made 403/404/500 pages, layout and tab components, mobile-adaptive layout, and a built-in CLI for git commits and releases.Is there a version for a UI library other than NaiveUI?Yes — besides the main NaiveUI version there are AntDesignVue and ElementPlus variants, each with live previews and repos, plus a legacy older version. The community also maintains skyroc-admin, a React implementation.
Yes — besides the main NaiveUI version there are AntDesignVue and ElementPlus variants, each with live previews and repos, plus a legacy older version. The community also maintains skyroc-admin, a React implementation.How does mock data work during development?The template ships with an online mock solution based on ApiFox, so API stubs need no extra setup. The ecosystem also offers electron-mock-admin, a mock API manager for front-end developers.
The template ships with an online mock solution based on ApiFox, so API stubs need no extra setup. The ecosystem also offers electron-mock-admin, a mock API manager for front-end developers.Is there a ready back-end I can pair it with?Yes — several community back-ends are adapted to it: pea (Spring Boot 3.2 + JDK 21), MalusAdmin (.NET 7), PanisAdmin (Spring Boot 3), soybean-admin-go (Gin + GORM) and FastSoyAdmin (FastAPI + Vue3), with dynamic routes and interface auth wired up.
Yes — several community back-ends are adapted to it: pea (Spring Boot 3.2 + JDK 21), MalusAdmin (.NET 7), PanisAdmin (Spring Boot 3), soybean-admin-go (Gin + GORM) and FastSoyAdmin (FastAPI + Vue3), with dynamic routes and interface auth wired up.What are similar projects?vue-admin-better, vue-manage-system, vuestic-admin, vue-element-admin, vue-pure-admin, vue-vben-admin, iview-admin, gin-vue-admin
vue-admin-better, vue-manage-system, vuestic-admin, vue-element-admin, vue-pure-admin, vue-vben-admin, iview-admin, gin-vue-adminWhich topics is it in?permission, vue-admin, pinia, admin-template, mock, admin, router, pnpm, vue3, responsive, state-management, theme
permission, vue-admin, pinia, admin-template, mock, admin, router, pnpm, vue3, responsive, state-management, theme