vue-admin-box

Introduction

• Changelog
• After over three months of iteration, version 1.0 was officially released on August 10, 2021, along with four base templates for general use
• This is a personal open-source project with no restrictions on commercial use or personal research. Please give it a Star before using it
• Any illegal or inappropriate activities involving this project are unrelated to the source code

Preview

• demo

Base Templates

Four base templates are available, all suitable for starting a project from scratch. They can be viewed directly in the vue-admin-box-template repository:

1. template-ts-i18n — Base template with TypeScript + internationalization demo
2. template-ts — Base template with TypeScript only, no internationalization demo
3. template-js-i18n — Base template with JavaScript + internationalization demo
4. template-js — Base template with JavaScript only, no internationalization demo

About

vue-admin-box is a free and open-source admin dashboard template. Built with the latest versions of Vue 3 + Vite + Element Plus, it aims to simplify the complex configuration typically required for general-purpose back-office systems.

Key Features

• Router configuration and state management suited for admin dashboards (state supports local storage by default), with well-encapsulated Axios and API management
• Easily extensible theme configuration with three classic admin dashboard styles built in
• Simple page caching — just set the noCache property, no need to configure component names, route names, or other settings required by many frameworks
• Three types of business tables for typical CRUD operations — see "Business Tables", "Category-Linked Tables", and "Tree-Linked Tables" under the Pages section
• Refresh without route navigation, supporting cached page refresh — a feature most frameworks do not support
• Easily extensible internationalization solution, with two non-i18n base templates and two i18n base templates (TypeScript / JavaScript versions)
• Handwritten custom directives
• Battle-tested shared table and dialog components used across multiple admin projects — see "Business Tables", "Category-Linked Tables", and "Tree-Linked Tables" under the Pages section

Tech Stack

• MVVM Framework: Vue v3
• Build Tool: Vite v2
• UI Framework: Element Plus
• Router: Vue Router v4
• State Management: Vuex v4
• HTTP Client: Axios
• Utilities: @vueuse/core

Screenshots

Usage

1. Clone the repository

   git clone https://github.com/cmdparkour/vue-admin-box.git
   

2. Install dependencies

   npm install
   

3. Run

   npm run dev or npm run start
   

4. Build

   npm run build