dolphin-admin / vue-admin

🐬 Dolphin Admin Vue is an open source, lightweight, out-of-the-box, elegant and exquisite, internationalized backend management template based on Vue 3 + Vite + Naive UI + TypeScript + TailwindCSS.

Dolphin Admin Vue

English / 简体中文

Dolphin Admin Vue is an open source, lightweight, out-of-the-box, elegant and exquisite, internationalized backend management template based on Vue 3 + Vite + Naive UI + TypeScript + TailwindCSS.

Features

• Based on Vue 3, Vite
• TypeScript, of course
• Naive UI, a Vue 3-based UI library
• TailwindCSS, a utility-first CSS framework
• pnpm as package manager
• Sass as CSS preprocessor
• Vue Router for routing management
• Pinia for global state management
• Axios for request, and highly encapsulated
• Vue Use as Vue Hook library
• Vue Use Motion for animation
• iconify/json and unplugin-icons for icon management, you can use icones to use it quickly
• unplugin-auto-import and unplugin-vue-components for automatic import of components, hooks, and utility classes, freeing your hands
• vue-i18n, support internationalization
• ECharts for data visualization
• xlsx for Excel file import and export
• Socket.IO for real-time communication
• ESLint for code checking
• Prettier for code formatting
• CSpell for code spelling checking
• Husky, lint-staged, commitlint, cz-git for Git commit management
• taze for dependency version management
• Support absolute path import, use @/*
• Support third-party login like GitHub, Google, etc.
• Support desktop, use Tauri for desktop application packaging
• Deploy on Vercel, zero configuration (Vercel does not support WebSocket, please deploy byself)

TODO

• Use Docker and Docker Compose for containerization

Tech Stack

• Vue 3
• TypeScript
• Vite
• Naive UI
• Sass

Code Style

• Airbnb JavaScript Style Guide
• Dev Standard

Getting Started

Checklist

When using this template, please try to update your own information correctly according to the checklist:

• Organize README.md
• Modify the author name in LICENSE
• Modify the project name, description, author and other information in package.json
• Modify the environment variables in .env
• Modify the site metadata in index.html
• Change favicon.ico in the /public directory
• Modify the app metadata in /src/app.config.ts

Usage

Environment

• Node.js >=16.20.1
• pnpm

Configuration Environment Variables

Configure .env file, refer to .env.example.

PC App

Installation

pnpm i

Development

pnpm web:dev

Build

pnpm web:build

Desktop App

Development

pnpm desktop:dev

Deploy

Go to Vercel and select your Git repository, choose Vite as template, add production environment variables, and click deploy.

License

MIT License © 2023 Bruce Song from Bit Ocean