Introduction

Naive Admin Max is an enterprise-grade admin management framework built with Vue 3 + TypeScript + Vite + Naive UI. It provides a complete, production-ready foundation for building medium-to-large-scale back-office applications.

Background

Building admin panels from scratch is time-consuming and error-prone. Developers often spend weeks scaffolding the same features: authentication, permissions, theming, multi-tab navigation, and CRUD operations. Naive Admin Max eliminates this repetitive work by providing a batteries-included template with best practices baked in.

Goals

• Zero-config startup — Clone the repo, install dependencies, and start developing immediately with built-in mock data.
• Enterprise-grade patterns — Route-level and button-level permissions, token renewal, request deduplication, and automatic retries.
• Developer experience first — TypeScript everywhere, <script setup> syntax, auto-imports, and strict linting.
• Highly customizable — 60+ preference options, 7 layout modes, and a complete theme system.
• International-ready — Built-in Chinese and English locales with seamless Naive UI locale switching.

Tech Stack

Category	Technology
Framework	Vue 3.5 (<script setup>) + TypeScript 6
Build Tool	Vite 8
UI Library	Naive UI 2.44, @vicons / @icon-park icons
State Management	Pinia 3 + pinia-plugin-persistedstate (persistence + schema migration)
Routing	Vue Router 5 (static routes + dynamic mounting after login)
HTTP Client	Axios 1.16 (unified interceptors, 401 auto-logout, dedup, loading/message)
Internationalization	Vue I18n 11.4 (zh-CN / en-US)
Charts	ECharts 6
Rich Text / Crop	wangEditor, cropperjs
Quality	vue-tsc, ESLint 10 (flat config) + Prettier 3.8

Key Features at a Glance

• Permission system: v-auth directive for button-level control, route guards for page-level access
• Dynamic routing: Menu-driven routes loaded after authentication via import.meta.glob
• Multi-tab + keep-alive: Tab-based navigation with intelligent component caching
• Theme engine: Light/dark/system modes, 7 layout variants, custom color themes, cross-tab sync
• Lock screen: One-click lock with optional PIN, server-side password verification
• Data dictionary: Centralized enum management with reactive options, labels, and tag rendering
• HTTP wrapper: Request deduplication, automatic retries on 5xx/timeout, token renewal, abort on route change
• Declarative row actions: useRowActions composable for clean, maintainable table operation columns