# Geeker-Admin: a Vue 3 admin template built around ProTable and button-level permissions

> Geeker-Admin is an MIT-licensed Vue 3.4 admin scaffold that ships a configured ProTable wrapper, dynamic route permissions and a full lint and commit toolchain. It is a starting point you copy, not a library you install, and its backend is entirely mock data.

**HalseySpicy/Geeker-Admin** — ✨✨✨ Geeker Admin，基于 Vue3.4、TypeScript、Vite5、Pinia、Element-Plus 开源的一套后台管理框架。

- Repository: https://github.com/HalseySpicy/Geeker-Admin
- Website: https://admin.spicyboy.cn
- Stars: 8,093 · Forks: 1,670
- Language: Vue
- License: MIT
- Published: 2026-09-22 · Updated: 2026-09-22 · Language: en
- Canonical page: https://hysenlabs.com/projects/halseyspicy-geeker-admin

## The problem Geeker-Admin picks up after the scaffold

Running create-vue gives you a router, a store and a blank App.vue. What it does not give you is the part every internal tool repeats: a login flow, a layout with sidebar and tabs, a permission model that hides buttons a user cannot press, and a table that paginates and searches without a hundred lines of template per screen. Geeker-Admin is a repository you clone and rewrite, aimed at the developer who would otherwise spend two weeks rebuilding that shell before writing the one screen the business actually asked for.

The README states the project is built on Vue 3.4, TypeScript, Vite 5, Pinia and Element Plus, and that it provides a ProTable component plus packaged components, hooks, directives, dynamic routes and button-level permission control. That list is the pitch: the value is in the pre-wired conventions, not in any single feature. The audience is a front-end team on the Chinese Vue ecosystem, comfortable with pnpm and TypeScript, who wants Element Plus rather than a headless component library.

## How the pieces fit: Vite, Pinia, Axios and the permission router

The repository layout is unusually explicit about the seams. src/routers holds route management, src/stores holds Pinia stores, src/api holds interface definitions, src/directives holds the global directives, and src/hooks holds the shared composition functions. Vite configuration lives in build/ rather than a single monolithic vite.config.ts, and environment values sit in .env, .env.development, .env.test and .env.production. If you have worked on a Vue admin before, you can find the file you need from the tree alone.

Axios is wrapped in TypeScript across the whole request path: interceptors, cancellation and common request helpers, per the README. The permission model is split between the router and the directives. Vue Router handles dynamic route interception and lazy loading, while a permission directive covers button-level control inside a page. KeepAlive caches pages, and the README notes support for multi-level nested route caching, which is the part that usually breaks when route names and component names drift apart.

ProTable is the centre of gravity. Table pages are described as configuration items in Columns, meaning you declare columns and let the component handle rendering, rather than writing el-table-column by hand. The README links a separate article on Juejin for the component's design. The project also supports Element component size switching, multiple theme layouts, dark mode and i18n. Note that the backend is mock only: the README credits FastMock and EasyMock, so every request in the demo resolves against a mock platform, and nothing in the repository defines a real server contract.

## Install Geeker-Admin and get the dev server running

The README gives clone, install, run, build, lint and commit steps. Clone from either host, since the project mirrors to Gitee and GitHub:

```bash
git clone https://github.com/HalseySpicy/Geeker-Admin.git
cd Geeker-Admin
pnpm install
```

Then start the dev server. The README lists both pnpm dev and pnpm serve, and the package.json scripts show both map to vite, so they are the same command under two names:

```bash
pnpm dev
```

Vite prints a local URL in the terminal; open it and you land on the login page shown in the README screenshots. Because the API layer points at mock platforms, you can log in and click through the table, dashboard and data screen pages without standing up any backend.

Builds are split by environment, and each one runs vue-tsc before vite build, so type errors fail the build rather than being stripped:

```bash
pnpm build:dev
pnpm build:test
pnpm build:pro
```

The lint scripts are equally concrete. pnpm lint:eslint runs eslint with --fix over ./src, pnpm lint:prettier writes formatting across the source globs, and pnpm lint:stylelint handles styles. Commits go through pnpm commit, which the package.json defines as git add -A && czg && git push, and the README notes that lint-staged runs automatically before the commit. That last detail matters: pnpm commit pushes to the remote as part of the same command.

## Where Geeker-Admin stops being the right tool

The mock backend is the first real limitation. The README says the project backend interface is entirely mock data, so there is no server, no database schema and no authentication contract to copy. You will design your own API shape and then rewrite src/api and the Axios interceptors to match it. Teams that read "admin framework" as "admin system" will be disappointed.

Release cadence is the second. The tagged releases are v1.0.0 in April 2023, v1.1.0 in July 2023 and v1.2.0 in September 2023, and package.json still carries version 1.2.0. The last push to the default branch was on 2026-07-29, so the repository is not archived and work continues, but the version number and the release tags have not moved with it. If your procurement process requires tagged releases with changelogs, the CHANGELOG.md is where that trail lives, and it is thin.

The React version is not in this repository. The README points to a separate paid product at pro.spicyboy.cn, reached by adding the author on WeChat. That is a commercial arrangement, not an open source sibling, and it means React teams get no free path from this codebase.

Browser support is also bounded. The README's table marks IE as not supported and lists the last two versions of Edge, Firefox, Chrome and Safari, linking to Can I Use for ES modules. If you must serve an embedded browser from an old industrial terminal, this template will not run there.

## Alternatives: Vue-pure-admin, Vben Admin and Soybean Admin

The searches people run around this project mostly land on the same three neighbours. Vue-pure-admin and its Pure Admin branding take a similar Vue 3 and Element Plus route but lean harder on a pure, hook-driven structure; the practical difference is how much of the page composition is expressed in configuration versus composition functions. Vben Admin sits closer to a full application platform, with a heavier abstraction layer over the router and a broader set of built-in features; the cost is a steeper read before you can change anything. Soybean Admin is the newer entrant in that group and tends to be chosen when a team wants a different component baseline and a more recent dependency set.

Geeker-Admin's distinguishing choice is ProTable. In the alternatives, table screens are usually assembled from a component library's primitives plus your own wrapper. Here the wrapper is part of the template and the README treats column configuration as the standard way to build a table page. If your application is mostly CRUD grids, that decision saves real time. If your screens are mostly bespoke dashboards and forms, the advantage shrinks and the other templates' broader layouts may fit better. None of these projects ships a backend either, so the mock-data caveat is not a differentiator.

## Licence, upgrades and what maintenance actually costs

The licence is MIT, declared in both the LICENSE file and the license field of package.json, and the package is marked private. In practical terms that means you can fork, modify and ship the code inside a commercial product, provided you keep the copyright notice. This is not legal advice; read the LICENSE file and your own counsel's position if the fork becomes load-bearing.

Upgrade cost is the real budget line. Dependencies are caret-ranged in package.json, covering element-plus, pinia, axios, echarts, @vueuse/core, dayjs, driver.js, mitt, nprogress and the wangEditor packages, among others. A caret range means a fresh pnpm install can pull newer minor versions than the author last ran, and an admin template touches all of them at once. The project's own answer is pnpm type:check, which runs vue-tsc --noEmit --skipLibCheck, and the type-checked build scripts. Run those after any dependency bump before you trust the result.

The commit tooling is opinionated and will affect your team. husky, lint-staged, commitlint, czg and cz-git are all configured at the top level, and pnpm commit pushes as well as commits. Teams with an existing Git workflow should decide early whether to keep that script or replace it, because a script that pushes on your behalf is easy to run by accident.

## Conclusion

Adopt Geeker-Admin if you want a Vue 3.4 and Element Plus admin shell where table pages are column configuration rather than hand-written markup, and you are willing to replace the mock layer with your own API before anything ships. Skip it if you need server-side rendering, a maintained release cadence with frequent tagged versions, or a backend included in the box. Before committing, verify the router permission flow in src/routers against your own role model, and confirm that the ProTable configuration surface covers the columns and actions your screens need.

## FAQ

### What is Geeker-Admin built with?

The README states it is built on Vue 3.4, TypeScript, Vite 5, Pinia and Element Plus, using single-file components with script setup. It also lists packaged components, hooks, directives, dynamic routes and button-level permission control.

### Does Geeker-Admin include a backend API?

No. The README says the project backend interface is entirely mock data, crediting FastMock and EasyMock as the mock platforms. You replace src/api and the Axios wrapper with calls to your own server.

### How do I install and run Geeker-Admin locally?

Clone the repository from GitHub or Gitee, run pnpm install, then run pnpm dev or pnpm serve, both of which map to vite. The README recommends the latest Chrome for local development.

### Is Geeker-Admin actively maintained?

The repository is not archived and the last push to the default branch was on 2026-07-29. The most recent tagged release is v1.2.0 from 2023-09-15, and package.json still carries version 1.2.0.

### What licence does Geeker-Admin use?

MIT, declared in the LICENSE file and in the license field of package.json. The package itself is marked private, which affects publishing to a registry rather than your right to fork and modify it.

## Sources

- [HalseySpicy/Geeker-Admin on GitHub](https://github.com/HalseySpicy/Geeker-Admin)
- [License: MIT](https://github.com/HalseySpicy/Geeker-Admin/blob/master/LICENSE)
- [Project website](https://admin.spicyboy.cn)
- [README](https://github.com/HalseySpicy/Geeker-Admin/blob/master/README.md)
- [Releases](https://github.com/HalseySpicy/Geeker-Admin/releases)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/halseyspicy-geeker-admin
