vue-naive-admin icon indicating copy to clipboard operation
vue-naive-admin copied to clipboard

⚡️基于 Vue3 + Vite + Pinia + Unocss + Naive UI 的轻量级后台管理模板。

Vue Naive Admin Logo

English | 简体中文

Introduction

Vue Naive Admin is a **completely open source free and commercially allowed ** admin template,Based on the latest technology stack of front-end such as Vue3、Vite3、Pinia、Unocss and Naive UI. Compared with other more popular backend management templates, this project is more concise, lightweight, fresh style, very low learning costs, ideal for small and medium-sized projects or personal projects.

Features

  • 🍒 Integrated Naive UI,recommended by Evan You.
  • 🍑 Integrated login, logout and permission verification.
  • 🍐 Integrated multi-environment configuration, dev, test, production and github pages environments.
  • 🍎 Integrated eslint + prettier.
  • 🍌 Integrated husky + commitlint.
  • 🍉 Integrated Mock.
  • 🍍 Integrated pinia,lightweight, simple and easy to use alternative to vuex.
  • 📦 Integrated unplugin auto import.
  • 🤹 Integrated iconify icon,support custom svg icons.
  • 🍇 Integrated unocss.

Preview

https://template.qszone.com

https://zclzone.github.io/vue-naive-admin

Docs

Vue Naive Admin Docs

Getting Started

# Recommended setup git autocrlf 为 false
git config --global core.autocrlf false

# Clone Project
git clone https://github.com/zclzone/vue-naive-admin.git

cd vue-naive-admin

# Install dependencies(Recommended use pnpm: https://pnpm.io/zh/installation)
npm i -g pnpm # Installed and can be ignored
pnpm i # or npm i

# Start
pnpm dev

Build and Release

# Test Environment
pnpm build:test

# Github Environment
pnpm build:github

# Prod Environment
pnpm build

Other

# eslint check
pnpm lint

# eslint check and fix
pnpm lint:fix

# Preview(Need to build first)
pnpm preview

# Commit(husky+commitlint)
pnpm cz

TS version: Qs Admin

source code

preview

Communication group & About the author