docs(readme): 重构项目README文档提升品牌形象和用户体验
- 重写README.zh-CN.md和README.md，全面提升文档质量 - 更新项目品牌从Nova Admin到Coi Admin - 添加现代化的badges和技术栈展示 - 完善项目介绍、特性说明和快速开始指南 - 新增详细的组件系统和API管理文档 - 补充开发规范、部署指南和贡献指南 - 统一中英文文档结构，提供国际化支持 - 采用emoji和现代排版提升文档可读性 变更范围： - 项目品牌更新：Nova Admin → Coi Admin - 技术栈信息：Vue3.5.16, Vite6.3.5, TypeScript5.8.3等 - 新增：Coi组件库文档、开发标准、图标使用规范 - 完善：安装指南、构建流程、部署配置 - 提升：文档美观度和专业性
This commit is contained in:
Leo
parent
c0c092cfe6
commit
f0fdf5d13e
475
README.md
475
README.md
@ -1,121 +1,460 @@
|
|||||||
<div align="center">
|
<div align="center">
|
||||||
<img src="https://s2.loli.net/2023/10/27/WzQ4JLNV5epKh6X.png" style="width:150px"/>
|
<img src="https://s2.loli.net/2023/10/27/WzQ4JLNV5epKh6X.png" style="width:150px"/>
|
||||||
<h1>Nova Admin</h1>
|
<h1>🚀 Coi Admin</h1>
|
||||||
|
<p>A Modern Admin Dashboard Template Based on Vue3 + Vite + TypeScript + Naive UI</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div align="center">
|
<div align="center">
|
||||||
<img src="https://img.shields.io/github/license/chansee97/nova-admin"/>
|
|
||||||
<img src="https://badgen.net/github/stars/chansee97/nova-admin?icon=github"/>
|
[](LICENSE)
|
||||||
<img src="https://gitee.com/chansee97/nova-admin/badge/star.svg"/>
|
[](https://vuejs.org/)
|
||||||
<img src="https://img.shields.io/github/forks/chansee97/nova-admin"/>
|
[](https://vitejs.dev/)
|
||||||
|
[](https://www.typescriptlang.org/)
|
||||||
|
[](https://www.naiveui.com/)
|
||||||
|
[](https://unocss.dev/)
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div align='center'>
|
<div align="center">
|
||||||
|
|
||||||
|
**English | [简体中文](./README.zh-CN.md)**
|
||||||
|
|
||||||
English | [中文](./README.zh-CN.md)
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
## Introduction
|
---
|
||||||
|
|
||||||
[Nova-admin](https://github.com/chansee97/nova-admin) is a clean and concise back-end management template based on Vue3, Vite5, Typescript, and Naive UI. It implements complete functionality in a simple way, while also considering code standards, readability, and avoiding excessive encapsulation to facilitate secondary development.
|
## ✨ Introduction
|
||||||
|
|
||||||
- [Nova-Admin preview](https://nova-admin.pages.dev/)
|
**Coi Admin** is a modern admin dashboard template built with the latest frontend technologies. The project adopts a clean design philosophy and provides complete permission management, user management, system management, and other features, aiming to provide developers with an out-of-the-box admin solution.
|
||||||
- [Nova-Admin docs](https://nova-admin-docs.pages.dev/)
|
|
||||||
|
|
||||||
## Features
|
### 🎯 Design Philosophy
|
||||||
|
|
||||||
- Developed based on the latest technology stack including Vue3, Vite6, TypeScript, NaiveUI, Unocss, etc.
|
- **🎨 Clean & Beautiful** - Adopts Naive UI design language with a clean and modern interface
|
||||||
- Based on [alova](https://alova.js.org/) encapsulation and configuration, providing unified response handling and multi-scenario capabilities.
|
- **⚡ Developer Friendly** - Complete TypeScript support and excellent development experience
|
||||||
- Comprehensive front-end and back-end permission management solution.
|
- **📱 Responsive Design** - Perfect adaptation for desktop and mobile devices
|
||||||
- Supports local static routes and dynamically generated routes from the back end, with easy route configuration.
|
- **🔧 Easy Customization** - Flexible configuration system for easy theme and layout customization
|
||||||
- Secondary encapsulation of commonly used components to meet basic work requirements.
|
- **📚 Complete Standards** - Detailed development specifications and code comments
|
||||||
- Dark theme adaptation, maintaining the Naive style for interface aesthetics.
|
|
||||||
- Only performs eslint validation during submission without excessive restrictions for simpler development.
|
|
||||||
- Flexible and configurable interface style layout.
|
|
||||||
- Multilanguage (i18n) support.
|
|
||||||
|
|
||||||
## Project preview
|
---
|
||||||
|
|
||||||
|
## 🚀 Core Features
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Repo
|
### 💎 Technology Architecture
|
||||||
|
- **🔥 Vue 3.5.16** - Latest Vue3 Composition API
|
||||||
|
- **⚡ Vite 6.3.5** - Ultra-fast frontend build tool
|
||||||
|
- **📘 TypeScript 5.8.3** - Complete type safety support
|
||||||
|
- **🎨 Naive UI 2.41.1** - Enterprise-grade component library
|
||||||
|
- **🎪 UnoCSS 66.2.0** - High-performance atomic CSS engine
|
||||||
|
- **🌐 Vue Router 4** - Official routing manager
|
||||||
|
- **📦 Pinia** - Next-generation state management
|
||||||
|
- **🔗 Alova** - Lightweight request library
|
||||||
|
|
||||||
- [Gitee](https://gitee.com/chansee97/nova-admin)
|
### 🛠️ Functional Features
|
||||||
- [Github](https://github.com/chansee97/nova-admin)
|
- **🔐 Complete Permission System** - RBAC-based permission management with route-level, component-level, and button-level permission control
|
||||||
|
- **👤 User Management** - Complete user CRUD operations with role assignment and permission management
|
||||||
|
- **🏷️ Role Management** - Flexible role permission configuration with dynamic permission assignment
|
||||||
|
- **📋 Menu Management** - Dynamic menu configuration supporting icons, routes, and various properties
|
||||||
|
- **🔄 Route Management** - Support for static and dynamic routes with automatic breadcrumb generation
|
||||||
|
- **🌙 Theme Switching** - Support for light/dark theme switching with visual consistency
|
||||||
|
- **🌍 Internationalization** - Complete multi-language support
|
||||||
|
- **📊 Data Visualization** - Integrated chart components supporting various data display needs
|
||||||
|
|
||||||
## Interface document
|
### 🎨 Interface Features
|
||||||
|
- **📱 Responsive Layout** - Perfect adaptation to various screen sizes
|
||||||
|
- **🎯 Modern Design** - Adopts latest UI design trends
|
||||||
|
- **🎪 Animation Effects** - Rich transition animations enhancing user experience
|
||||||
|
- **📐 Flexible Layout** - Support for sidebar menu, top menu, mixed menu, and other layouts
|
||||||
|
- **🔖 Tab Management** - Support for multi-tab operations improving work efficiency
|
||||||
|
|
||||||
This project uses ApiFox for interface mock, check the online documentation for more interface details
|
---
|
||||||
[online aipfox docs](https://nova-admin.apifox.cn)
|
|
||||||
|
|
||||||
## Install and use
|
## 📦 Tech Stack
|
||||||
|
|
||||||
The local development environment is recommended to use pnpm 10.x, Node.js version 21.x.
|
| Technology | Version | Description |
|
||||||
|
|------------|---------|-------------|
|
||||||
|
| **Vue** | `3.5.16` | Progressive JavaScript framework |
|
||||||
|
| **Vite** | `6.3.5` | Next-generation frontend build tool |
|
||||||
|
| **TypeScript** | `5.8.3` | JavaScript superset providing type safety |
|
||||||
|
| **Naive UI** | `2.41.1` | Vue 3 enterprise component library |
|
||||||
|
| **UnoCSS** | `66.2.0` | High-performance atomic CSS engine |
|
||||||
|
| **Vue Router** | `4.5.1` | Vue.js official routing manager |
|
||||||
|
| **Pinia** | `3.0.3` | Vue state management library |
|
||||||
|
| **Alova** | `3.3.2` | Lightweight request strategy library |
|
||||||
|
| **Vue I18n** | `11.1.5` | Internationalization plugin |
|
||||||
|
| **VueUse** | `13.3.0` | Vue Composition utilities |
|
||||||
|
|
||||||
It is recommended to directly download the compressed package from [Releases](https://github.com/chansee97/nova-admin/releases)
|
---
|
||||||
|
|
||||||
|
## 📂 Project Structure
|
||||||
|
|
||||||
|
```
|
||||||
|
coder-common-thin-frontend/
|
||||||
|
├── 📁 src/
|
||||||
|
│ ├── 📁 components/ # Common components
|
||||||
|
│ │ ├── 📁 common/ # Generic components (Coi series)
|
||||||
|
│ │ └── 📁 custom/ # Custom components
|
||||||
|
│ ├── 📁 views/ # Page components
|
||||||
|
│ │ ├── 📁 dashboard/ # Dashboard
|
||||||
|
│ │ ├── 📁 system/ # System management
|
||||||
|
│ │ ├── 📁 personal-center/ # Personal center
|
||||||
|
│ │ └── 📁 login/ # Login page
|
||||||
|
│ ├── 📁 store/ # State management
|
||||||
|
│ │ ├── 📁 auth.ts # Authentication state
|
||||||
|
│ │ ├── 📁 router/ # Router state
|
||||||
|
│ │ └── 📁 app/ # Application state
|
||||||
|
│ ├── 📁 router/ # Router configuration
|
||||||
|
│ ├── 📁 service/ # API services
|
||||||
|
│ │ ├── 📁 api/ # Interface definitions
|
||||||
|
│ │ └── 📁 http/ # HTTP configuration
|
||||||
|
│ ├── 📁 utils/ # Utility functions
|
||||||
|
│ ├── 📁 hooks/ # Composable functions
|
||||||
|
│ ├── 📁 constants/ # Constants
|
||||||
|
│ ├── 📁 typings/ # Type definitions
|
||||||
|
│ └── 📁 styles/ # Style files
|
||||||
|
├── 📁 doc/ # Project documentation
|
||||||
|
├── 📁 locales/ # Internationalization packages
|
||||||
|
└── 📄 CLAUDE.md # Development standards documentation
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🚀 Quick Start
|
||||||
|
|
||||||
|
### 📋 Environment Requirements
|
||||||
|
|
||||||
|
Ensure your development environment meets the following requirements:
|
||||||
|
|
||||||
|
- **Node.js** `>= 21.x`
|
||||||
|
- **pnpm** `>= 10.x` (recommended)
|
||||||
|
|
||||||
|
### 📥 Installation
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# install dependencies
|
# Clone project
|
||||||
pnpm i
|
git clone <your-project-url>
|
||||||
|
|
||||||
# Run
|
# Enter project directory
|
||||||
|
cd coder-common-thin-frontend
|
||||||
|
|
||||||
|
# Install dependencies
|
||||||
|
pnpm install
|
||||||
|
```
|
||||||
|
|
||||||
|
### 🛠️ Development Environment
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Start development server (default port: 9980)
|
||||||
pnpm dev
|
pnpm dev
|
||||||
|
|
||||||
# Build product
|
# Start test environment
|
||||||
|
pnpm dev:test
|
||||||
|
|
||||||
|
# Start production environment
|
||||||
|
pnpm dev:prod
|
||||||
|
```
|
||||||
|
|
||||||
|
### 🏗️ Build & Deploy
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Build production version
|
||||||
pnpm build
|
pnpm build
|
||||||
|
|
||||||
|
# Build development version
|
||||||
|
pnpm build:dev
|
||||||
|
|
||||||
|
# Build test version
|
||||||
|
pnpm build:test
|
||||||
|
|
||||||
|
# Preview build result
|
||||||
|
pnpm preview
|
||||||
```
|
```
|
||||||
|
|
||||||
You can deploy **nova-admin** in a production environment using docker-compose.
|
### 🔍 Code Linting
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# Build product
|
# Run ESLint and type checking
|
||||||
|
pnpm lint
|
||||||
|
|
||||||
|
# Auto-fix code issues
|
||||||
|
pnpm lint:fix
|
||||||
|
|
||||||
|
# Check ESLint configuration
|
||||||
|
pnpm lint:check
|
||||||
|
|
||||||
|
# View bundle size analysis
|
||||||
|
pnpm sizecheck
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🎯 Core Functionality
|
||||||
|
|
||||||
|
### 🔐 Permission Management System
|
||||||
|
|
||||||
|
- **Multi-level Permission Verification** - Route-level, component-level, and API-level permission control
|
||||||
|
- **RBAC Permission Model** - Role-based access control
|
||||||
|
- **Permission Directives** - `v-permission` directive and `usePermission` composable
|
||||||
|
- **Super Permission** - Support for super admin bypassing permission checks
|
||||||
|
|
||||||
|
### 👥 User Management
|
||||||
|
|
||||||
|
- **User CRUD** - Complete user create, read, update, delete functionality
|
||||||
|
- **Role Assignment** - Flexible user role management
|
||||||
|
- **Status Management** - User enable/disable status control
|
||||||
|
- **Password Management** - Secure password reset functionality
|
||||||
|
|
||||||
|
### 🏷️ Role Management
|
||||||
|
|
||||||
|
- **Role Configuration** - Flexible role permission configuration
|
||||||
|
- **Permission Assignment** - Visual permission assignment interface
|
||||||
|
- **Role Inheritance** - Support for role permission inheritance mechanism
|
||||||
|
|
||||||
|
### 🌐 Routing System
|
||||||
|
|
||||||
|
- **Dynamic Routes** - Support for backend-returned dynamic route configuration
|
||||||
|
- **Static Routes** - Local static route configuration
|
||||||
|
- **Route Guards** - Complete route permission verification
|
||||||
|
- **Breadcrumbs** - Automatic navigation breadcrumb generation
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🎨 Component System
|
||||||
|
|
||||||
|
### 🧩 Coi Component Library
|
||||||
|
|
||||||
|
The project includes a built-in **Coi** series component library providing unified design language:
|
||||||
|
|
||||||
|
- **CoiDialog** - Unified dialog component supporting ESC close, mask close, and other features
|
||||||
|
- **CoiEmpty** - Beautiful empty state component supporting multiple types and custom actions
|
||||||
|
- **CoiIcon** - Icon component supporting Iconify icon library
|
||||||
|
|
||||||
|
### 📝 Usage Examples
|
||||||
|
|
||||||
|
```vue
|
||||||
|
<template>
|
||||||
|
<!-- Dialog usage -->
|
||||||
|
<CoiDialog
|
||||||
|
ref="dialogRef"
|
||||||
|
title="Confirm Action"
|
||||||
|
@coi-confirm="handleConfirm"
|
||||||
|
@coi-cancel="handleCancel"
|
||||||
|
>
|
||||||
|
<template #content>
|
||||||
|
<p>Are you sure you want to perform this action?</p>
|
||||||
|
</template>
|
||||||
|
</CoiDialog>
|
||||||
|
|
||||||
|
<!-- Empty state usage -->
|
||||||
|
<CoiEmpty
|
||||||
|
type="search"
|
||||||
|
:show-action="true"
|
||||||
|
action-text="Search Again"
|
||||||
|
@action="handleRefresh"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📊 API Management
|
||||||
|
|
||||||
|
### 🔗 API Interfaces
|
||||||
|
|
||||||
|
The project uses **ApiFox** for interface management and Mock:
|
||||||
|
|
||||||
|
- **Online Documentation**: [https://nova-admin.apifox.cn](https://nova-admin.apifox.cn)
|
||||||
|
- **Interface Categories**: Authentication, user management, role management, system management, etc.
|
||||||
|
- **Mock Data**: Complete interface Mock data support
|
||||||
|
|
||||||
|
### 📡 HTTP Client
|
||||||
|
|
||||||
|
HTTP client based on **Alova** encapsulation:
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// API call example
|
||||||
|
import { addUser, getUserList } from '@/service/api/system/user'
|
||||||
|
|
||||||
|
// Get user list
|
||||||
|
const { data } = await getUserList({ pageNo: 1, pageSize: 10 })
|
||||||
|
|
||||||
|
// Add user
|
||||||
|
await addUser({ userName: 'test', loginName: 'test' })
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📚 Development Standards
|
||||||
|
|
||||||
|
The project includes complete development standards documentation `CLAUDE.md`, covering:
|
||||||
|
|
||||||
|
### 🎯 Core Principles
|
||||||
|
- **Readability First** - Code is written for humans to read
|
||||||
|
- **DRY Principle** - Don't Repeat Yourself
|
||||||
|
- **High Cohesion, Low Coupling** - Modular design
|
||||||
|
|
||||||
|
### 📋 Coding Standards
|
||||||
|
- **Naming Conventions** - Unified naming agreements
|
||||||
|
- **File Organization** - Clear directory structure
|
||||||
|
- **Component Development** - Component development best practices
|
||||||
|
- **API Design** - RESTful API design standards
|
||||||
|
|
||||||
|
### 🎨 Icon Usage Standards
|
||||||
|
- **Unified Icon Library** - Use `icon-park-outline` icon library
|
||||||
|
- **Semantic Icons** - Icon meaning matches functionality
|
||||||
|
- **Button Requirements** - All buttons must include icons
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🌍 Internationalization Support
|
||||||
|
|
||||||
|
The project includes complete internationalization support:
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// Language configuration
|
||||||
|
const { t } = useI18n()
|
||||||
|
|
||||||
|
// Use translation
|
||||||
|
const title = t('common.confirm')
|
||||||
|
```
|
||||||
|
|
||||||
|
Supported languages:
|
||||||
|
- 🇨🇳 Simplified Chinese
|
||||||
|
- 🇺🇸 English
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🎨 Theme Customization
|
||||||
|
|
||||||
|
### 🌙 Theme Switching
|
||||||
|
|
||||||
|
Support seamless light/dark theme switching:
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// Theme switching
|
||||||
|
const { theme, toggleTheme } = useTheme()
|
||||||
|
```
|
||||||
|
|
||||||
|
### 🎨 Style Customization
|
||||||
|
|
||||||
|
- **CSS Variables** - Support CSS variable customization
|
||||||
|
- **UnoCSS** - Atomic CSS for flexible customization
|
||||||
|
- **Theme Colors** - Configurable theme color schemes
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📖 Development Guide
|
||||||
|
|
||||||
|
### 🔧 Adding New Pages
|
||||||
|
|
||||||
|
1. Create page component in `src/views/`
|
||||||
|
2. Add route configuration in `src/router/routes.static.ts`
|
||||||
|
3. Configure permission requirements (roles field)
|
||||||
|
|
||||||
|
### 🔌 Adding New APIs
|
||||||
|
|
||||||
|
1. Define interfaces in `src/service/api/`
|
||||||
|
2. Use project-encapsulated alova instance
|
||||||
|
3. Follow unified response handling format
|
||||||
|
|
||||||
|
### 🧩 Adding New Components
|
||||||
|
|
||||||
|
1. Create component in `src/components/`
|
||||||
|
2. Use TypeScript to define Props and Emits
|
||||||
|
3. Follow Coi component naming conventions
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🚀 Deployment Guide
|
||||||
|
|
||||||
|
### 📦 Build Optimization
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Production build
|
||||||
|
pnpm build
|
||||||
|
|
||||||
|
# Analyze bundle size
|
||||||
|
pnpm sizecheck
|
||||||
|
```
|
||||||
|
|
||||||
|
### 🐳 Docker Deployment
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Deploy using Docker Compose
|
||||||
docker compose -f docker-compose.product.yml up --build -d
|
docker compose -f docker-compose.product.yml up --build -d
|
||||||
```
|
```
|
||||||
> The nginx.conf provided is for reference only. You can adjust it according to your own needs.
|
|
||||||
|
|
||||||
## Related projects
|
### 🌐 Nginx Configuration
|
||||||
|
|
||||||
- [Nova-admin-nest](https://github.com/chansee97/nova-admin-nest) (under development) Nova-Admin supporting background project based on TS, NestJs, typeorm
|
Refer to the `nginx.conf` configuration file in the project.
|
||||||
|
|
||||||
## Learn to communicate
|
---
|
||||||
|
|
||||||
Nova-Admin is a completely open-source and free project. It is still being optimized and iterated. It is designed to help developers more conveniently develop medium and large management systems. If you have any questions, please ask questions in the QQ exchange group.
|
## 🤝 Contributing
|
||||||
|
|
||||||
| Q-Group | wechat-Group |
|
We welcome all forms of contributions!
|
||||||
| :--: |:--: |
|
|
||||||
| <img src="https://cdn.jsdelivr.net/gh/chansee97/static/nova-admin/q-group.png" width=170> |<img src="https://cdn.jsdelivr.net/gh/chansee97/static/wechat.png" width=170>|
|
|
||||||
|
|
||||||
> Please indicate the purpose of adding WeChat.
|
### 🐛 Bug Reports
|
||||||
|
|
||||||
## Contribution
|
If you find bugs or have feature suggestions:
|
||||||
|
|
||||||
If you find any issues or have suggestions for improvement, please create an [issue](nova-admin/issues/new) or submit a PR. We welcome your contributions!
|
1. Check [Issues](../../issues) for existing related issues
|
||||||
|
2. Create a new Issue with detailed problem description or suggestions
|
||||||
|
3. If possible, provide reproduction steps or expected behavior
|
||||||
|
|
||||||
## Support
|
### 💡 Feature Suggestions
|
||||||
|
|
||||||
If you feel that this project is helpful for your work or study, please help me order a ✨ Star, which will be a great encouragement and support for me, or you can buy me a cup of coffee below
|
We welcome new feature suggestions:
|
||||||
|
|
||||||
| wechat | alipay |
|
1. Ensure suggestions align with project goals
|
||||||
| :--: |:--: |
|
2. Provide detailed feature requirements and use cases
|
||||||
| <img src="https://cdn.jsdelivr.net/gh/chansee97/static/sponsor-wechat.png" width=170> | <img src="https://cdn.jsdelivr.net/gh/chansee97/static/sponsor-alipay.png" width=170>|
|
3. If possible, provide design solutions or prototypes
|
||||||
|
|
||||||
## Contributors
|
### 🔧 Code Contributions
|
||||||
|
|
||||||
Thanks for all their contributions!
|
1. Fork this repository
|
||||||
|
2. Create a new feature branch: `git checkout -b feature/amazing-feature`
|
||||||
|
3. Commit your changes: `git commit -m 'feat: add amazing feature'`
|
||||||
|
4. Push to the branch: `git push origin feature/amazing-feature`
|
||||||
|
5. Submit a Pull Request
|
||||||
|
|
||||||
<a href="https://github.com/chansee97/nova-admin/graphs/contributors">
|
### 📝 Commit Standards
|
||||||
<img src="https://contrib.rocks/image?repo=chansee97/nova-admin" alt="contributors" />
|
|
||||||
</a>
|
|
||||||
|
|
||||||
## Star History
|
Please follow [Conventional Commits](https://conventionalcommits.org/) specification:
|
||||||
|
|
||||||
[](https://star-history.com/#chansee97/nova-admin&Date)
|
```
|
||||||
|
feat: new features
|
||||||
|
fix: bug fixes
|
||||||
|
docs: documentation updates
|
||||||
|
style: code formatting adjustments
|
||||||
|
refactor: code refactoring
|
||||||
|
test: test-related
|
||||||
|
chore: build process or auxiliary tool changes
|
||||||
|
```
|
||||||
|
|
||||||
## License
|
---
|
||||||
|
|
||||||
[MIT](LICENSE)
|
## 📄 License
|
||||||
|
|
||||||
|
This project is open source under the [MIT](LICENSE) license.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🙏 Acknowledgments
|
||||||
|
|
||||||
|
Thanks to the following excellent open source projects:
|
||||||
|
|
||||||
|
- [Vue.js](https://vuejs.org/) - Progressive JavaScript framework
|
||||||
|
- [Vite](https://vitejs.dev/) - Next-generation frontend build tool
|
||||||
|
- [Naive UI](https://www.naiveui.com/) - Vue 3 component library
|
||||||
|
- [UnoCSS](https://unocss.dev/) - Atomic CSS engine
|
||||||
|
- [Alova](https://alova.js.org/) - Lightweight request strategy library
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
<div align="center">
|
||||||
|
|
||||||
|
**If this project helps you, please give it a ⭐**
|
||||||
|
|
||||||
|
**Let's build better admin systems together!**
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|||||||
475
README.zh-CN.md
475
README.zh-CN.md
@ -1,121 +1,460 @@
|
|||||||
<div align="center">
|
<div align="center">
|
||||||
<img src="https://s2.loli.net/2023/10/27/WzQ4JLNV5epKh6X.png" style="width:150px"/>
|
<img src="https://s2.loli.net/2023/10/27/WzQ4JLNV5epKh6X.png" style="width:150px"/>
|
||||||
<h1>Nova Admin</h1>
|
<h1>🚀 Coi Admin</h1>
|
||||||
|
<p>基于 Vue3 + Vite + TypeScript + Naive UI 的现代化后台管理系统</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div align="center">
|
<div align="center">
|
||||||
<img src="https://img.shields.io/github/license/chansee97/nova-admin"/>
|
|
||||||
<img src="https://badgen.net/github/stars/chansee97/nova-admin?icon=github"/>
|
[](LICENSE)
|
||||||
<img src="https://gitee.com/chansee97/nova-admin/badge/star.svg"/>
|
[](https://vuejs.org/)
|
||||||
<img src="https://img.shields.io/github/forks/chansee97/nova-admin"/>
|
[](https://vitejs.dev/)
|
||||||
|
[](https://www.typescriptlang.org/)
|
||||||
|
[](https://www.naiveui.com/)
|
||||||
|
[](https://unocss.dev/)
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div align='center'>
|
<div align="center">
|
||||||
|
|
||||||
|
**[English](./README.md) | 简体中文**
|
||||||
|
|
||||||
[English](./README.md) | 中文
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
## 介绍
|
---
|
||||||
|
|
||||||
[Nova-admin](https://github.com/chansee97/nova-admin)是一个基于Vue3、Vite5、Typescript、Naive UI, 简洁干净后台管理模板，用简单的方式实现完整功能，并尽可能的考虑代码规范，易读易理解无过度封装，方便二次开发。
|
## ✨ 项目介绍
|
||||||
|
|
||||||
- [Nova-Admin 预览](https://nova-admin.pages.dev/)
|
**Coi Admin** 是一个基于最新前端技术栈开发的现代化后台管理系统模板。项目采用简洁的设计理念，提供完整的权限管理、用户管理、系统管理等功能，旨在为开发者提供开箱即用的后台管理解决方案。
|
||||||
- [Nova-Admin 文档](https://nova-admin-docs.pages.dev/)
|
|
||||||
|
|
||||||
## 特性
|
### 🎯 设计理念
|
||||||
|
|
||||||
- 基于Vue3、Vite6、TypeScript、NaiveUI、Unocss等最新技术栈开发
|
- **🎨 简洁美观** - 采用 Naive UI 设计语言，界面简洁现代
|
||||||
- 基于[alova](https://alova.js.org/)封装和配置，提供统一的响应处理和多场景能力
|
- **⚡ 开发友好** - 完善的 TypeScript 支持，优秀的开发体验
|
||||||
- 完善的前后端权限管理方案
|
- **📱 响应式设计** - 完美适配桌面端和移动端
|
||||||
- 支持本地静态路由和后台返回动态路由，路由简单易配置
|
- **🔧 易于定制** - 灵活的配置系统，轻松定制主题和布局
|
||||||
- 对日常使用频率较高的组件二次封装,满足基础工作需求
|
- **📚 规范完善** - 详细的开发规范和代码注释
|
||||||
- 黑暗主题适配, 界面样式保持Naive风格
|
|
||||||
- 仅在提交时进行eslint校验，没有过多限制，开发更简便
|
|
||||||
- 界面样式布局灵活可配置
|
|
||||||
- 多语言（i18n）支持
|
|
||||||
|
|
||||||
## 项目预览
|
---
|
||||||
|
|
||||||
|
## 🚀 核心特性
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## 代码仓库
|
### 💎 技术架构
|
||||||
|
- **🔥 Vue 3.5.16** - 最新的 Vue3 Composition API
|
||||||
|
- **⚡ Vite 6.3.5** - 极速的前端构建工具
|
||||||
|
- **📘 TypeScript 5.8.3** - 完整的类型安全支持
|
||||||
|
- **🎨 Naive UI 2.41.1** - 企业级组件库
|
||||||
|
- **🎪 UnoCSS 66.2.0** - 高性能原子化 CSS 引擎
|
||||||
|
- **🌐 Vue Router 4** - 官方路由管理器
|
||||||
|
- **📦 Pinia** - 新一代状态管理
|
||||||
|
- **🔗 Alova** - 轻量级请求库
|
||||||
|
|
||||||
- [Gitee](https://gitee.com/chansee97/nova-admin)
|
### 🛠️ 功能特性
|
||||||
- [Github](https://github.com/chansee97/nova-admin)
|
- **🔐 完整权限系统** - 基于 RBAC 的权限管理，支持路由级、组件级、按钮级权限控制
|
||||||
|
- **👤 用户管理** - 完整的用户CRUD操作，支持角色分配和权限管理
|
||||||
|
- **🏷️ 角色管理** - 灵活的角色权限配置，支持动态权限分配
|
||||||
|
- **📋 菜单管理** - 动态菜单配置，支持图标、路由等多种属性设置
|
||||||
|
- **🔄 路由管理** - 支持静态路由和动态路由，自动生成面包屑导航
|
||||||
|
- **🌙 主题切换** - 支持明暗主题切换，保持视觉一致性
|
||||||
|
- **🌍 国际化** - 完整的多语言支持
|
||||||
|
- **📊 数据可视化** - 集成图表组件，支持各种数据展示需求
|
||||||
|
|
||||||
## 接口文档
|
### 🎨 界面特色
|
||||||
|
- **📱 响应式布局** - 完美适配各种屏幕尺寸
|
||||||
|
- **🎯 现代化设计** - 采用最新的 UI 设计趋势
|
||||||
|
- **🎪 动画效果** - 丰富的过渡动画，提升用户体验
|
||||||
|
- **📐 灵活布局** - 支持左侧菜单、顶部菜单、混合菜单等多种布局
|
||||||
|
- **🔖 标签页管理** - 支持多标签页操作，提高工作效率
|
||||||
|
|
||||||
本项目使用ApiFox进行接口mock，查看在线文档以了解更多接口详情
|
---
|
||||||
[在线apifox文档](https://nova-admin.apifox.cn)
|
|
||||||
|
|
||||||
## 安装使用
|
## 📦 技术栈
|
||||||
|
|
||||||
本地开发环境建议使用 pnpm 10.x 、Node.js 21.x
|
| 技术 | 版本 | 描述 |
|
||||||
|
|------|------|------|
|
||||||
|
| **Vue** | `3.5.16` | 渐进式 JavaScript 框架 |
|
||||||
|
| **Vite** | `6.3.5` | 下一代前端构建工具 |
|
||||||
|
| **TypeScript** | `5.8.3` | JavaScript 的超集，提供类型安全 |
|
||||||
|
| **Naive UI** | `2.41.1` | Vue 3 企业级组件库 |
|
||||||
|
| **UnoCSS** | `66.2.0` | 高性能原子化 CSS 引擎 |
|
||||||
|
| **Vue Router** | `4.5.1` | Vue.js 官方路由管理器 |
|
||||||
|
| **Pinia** | `3.0.3` | Vue 状态管理库 |
|
||||||
|
| **Alova** | `3.3.2` | 轻量级请求策略库 |
|
||||||
|
| **Vue I18n** | `11.1.5` | 国际化插件 |
|
||||||
|
| **VueUse** | `13.3.0` | Vue Composition 工具库 |
|
||||||
|
|
||||||
推荐直接下载[Releases](https://github.com/chansee97/nova-admin/releases)压缩包
|
---
|
||||||
|
|
||||||
|
## 📂 项目结构
|
||||||
|
|
||||||
|
```
|
||||||
|
coder-common-thin-frontend/
|
||||||
|
├── 📁 src/
|
||||||
|
│ ├── 📁 components/ # 公共组件
|
||||||
|
│ │ ├── 📁 common/ # 通用组件 (Coi 系列)
|
||||||
|
│ │ └── 📁 custom/ # 自定义组件
|
||||||
|
│ ├── 📁 views/ # 页面组件
|
||||||
|
│ │ ├── 📁 dashboard/ # 仪表盘
|
||||||
|
│ │ ├── 📁 system/ # 系统管理
|
||||||
|
│ │ ├── 📁 personal-center/ # 个人中心
|
||||||
|
│ │ └── 📁 login/ # 登录页面
|
||||||
|
│ ├── 📁 store/ # 状态管理
|
||||||
|
│ │ ├── 📁 auth.ts # 认证状态
|
||||||
|
│ │ ├── 📁 router/ # 路由状态
|
||||||
|
│ │ └── 📁 app/ # 应用状态
|
||||||
|
│ ├── 📁 router/ # 路由配置
|
||||||
|
│ ├── 📁 service/ # API 服务
|
||||||
|
│ │ ├── 📁 api/ # 接口定义
|
||||||
|
│ │ └── 📁 http/ # HTTP 配置
|
||||||
|
│ ├── 📁 utils/ # 工具函数
|
||||||
|
│ ├── 📁 hooks/ # 组合式函数
|
||||||
|
│ ├── 📁 constants/ # 常量定义
|
||||||
|
│ ├── 📁 typings/ # 类型定义
|
||||||
|
│ └── 📁 styles/ # 样式文件
|
||||||
|
├── 📁 doc/ # 项目文档
|
||||||
|
├── 📁 locales/ # 国际化语言包
|
||||||
|
└── 📄 CLAUDE.md # 开发规范文档
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🚀 快速开始
|
||||||
|
|
||||||
|
### 📋 环境要求
|
||||||
|
|
||||||
|
确保你的开发环境满足以下要求：
|
||||||
|
|
||||||
|
- **Node.js** `>= 21.x`
|
||||||
|
- **pnpm** `>= 10.x` (推荐使用 pnpm)
|
||||||
|
|
||||||
|
### 📥 安装依赖
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# install dependencies
|
# 克隆项目
|
||||||
pnpm i
|
git clone <your-project-url>
|
||||||
|
|
||||||
# Run
|
# 进入项目目录
|
||||||
|
cd coder-common-thin-frontend
|
||||||
|
|
||||||
|
# 安装依赖
|
||||||
|
pnpm install
|
||||||
|
```
|
||||||
|
|
||||||
|
### 🛠️ 开发环境
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 启动开发服务器 (默认端口: 9980)
|
||||||
pnpm dev
|
pnpm dev
|
||||||
|
|
||||||
# Build product
|
# 启动测试环境
|
||||||
|
pnpm dev:test
|
||||||
|
|
||||||
|
# 启动生产环境
|
||||||
|
pnpm dev:prod
|
||||||
|
```
|
||||||
|
|
||||||
|
### 🏗️ 构建部署
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 构建生产版本
|
||||||
pnpm build
|
pnpm build
|
||||||
|
|
||||||
|
# 构建开发版本
|
||||||
|
pnpm build:dev
|
||||||
|
|
||||||
|
# 构建测试版本
|
||||||
|
pnpm build:test
|
||||||
|
|
||||||
|
# 预览构建结果
|
||||||
|
pnpm preview
|
||||||
```
|
```
|
||||||
|
|
||||||
在生产环境也可以使用 docker-compose 部署 **nova-admin**
|
### 🔍 代码检查
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# Build product
|
# 运行 ESLint 检查和类型检查
|
||||||
|
pnpm lint
|
||||||
|
|
||||||
|
# 自动修复代码问题
|
||||||
|
pnpm lint:fix
|
||||||
|
|
||||||
|
# 检查 ESLint 配置
|
||||||
|
pnpm lint:check
|
||||||
|
|
||||||
|
# 查看打包体积分析
|
||||||
|
pnpm sizecheck
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🎯 核心功能
|
||||||
|
|
||||||
|
### 🔐 权限管理系统
|
||||||
|
|
||||||
|
- **多层权限验证** - 路由级、组件级、API级权限控制
|
||||||
|
- **RBAC权限模型** - 基于角色的访问控制
|
||||||
|
- **权限指令** - `v-permission` 指令和 `usePermission` 组合函数
|
||||||
|
- **Super权限** - 支持超级管理员绕过权限检查
|
||||||
|
|
||||||
|
### 👥 用户管理
|
||||||
|
|
||||||
|
- **用户CRUD** - 完整的用户增删改查功能
|
||||||
|
- **角色分配** - 灵活的用户角色管理
|
||||||
|
- **状态管理** - 用户启用/禁用状态控制
|
||||||
|
- **密码管理** - 安全的密码重置功能
|
||||||
|
|
||||||
|
### 🏷️ 角色管理
|
||||||
|
|
||||||
|
- **角色配置** - 灵活的角色权限配置
|
||||||
|
- **权限分配** - 可视化的权限分配界面
|
||||||
|
- **角色继承** - 支持角色权限继承机制
|
||||||
|
|
||||||
|
### 🌐 路由系统
|
||||||
|
|
||||||
|
- **动态路由** - 支持后端返回的动态路由配置
|
||||||
|
- **静态路由** - 本地静态路由配置
|
||||||
|
- **路由守卫** - 完整的路由权限验证
|
||||||
|
- **面包屑** - 自动生成导航面包屑
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🎨 组件系统
|
||||||
|
|
||||||
|
### 🧩 Coi 组件库
|
||||||
|
|
||||||
|
项目内置了一套 **Coi** 系列组件，提供统一的设计语言：
|
||||||
|
|
||||||
|
- **CoiDialog** - 统一的对话框组件，支持 ESC 关闭、遮罩关闭等功能
|
||||||
|
- **CoiEmpty** - 美观的空状态组件，支持多种类型和自定义操作
|
||||||
|
- **CoiIcon** - 图标组件，支持 Iconify 图标库
|
||||||
|
|
||||||
|
### 📝 使用示例
|
||||||
|
|
||||||
|
```vue
|
||||||
|
<template>
|
||||||
|
<!-- 对话框使用 -->
|
||||||
|
<CoiDialog
|
||||||
|
ref="dialogRef"
|
||||||
|
title="确认操作"
|
||||||
|
@coi-confirm="handleConfirm"
|
||||||
|
@coi-cancel="handleCancel"
|
||||||
|
>
|
||||||
|
<template #content>
|
||||||
|
<p>确定要执行此操作吗？</p>
|
||||||
|
</template>
|
||||||
|
</CoiDialog>
|
||||||
|
|
||||||
|
<!-- 空状态使用 -->
|
||||||
|
<CoiEmpty
|
||||||
|
type="search"
|
||||||
|
:show-action="true"
|
||||||
|
action-text="重新搜索"
|
||||||
|
@action="handleRefresh"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📊 接口管理
|
||||||
|
|
||||||
|
### 🔗 API 接口
|
||||||
|
|
||||||
|
项目使用 **ApiFox** 进行接口管理和 Mock：
|
||||||
|
|
||||||
|
- **在线文档**: [https://nova-admin.apifox.cn](https://nova-admin.apifox.cn)
|
||||||
|
- **接口分类**: 认证、用户管理、角色管理、系统管理等
|
||||||
|
- **Mock数据**: 完整的接口 Mock 数据支持
|
||||||
|
|
||||||
|
### 📡 HTTP 客户端
|
||||||
|
|
||||||
|
基于 **Alova** 封装的 HTTP 客户端：
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// API 调用示例
|
||||||
|
import { addUser, getUserList } from '@/service/api/system/user'
|
||||||
|
|
||||||
|
// 获取用户列表
|
||||||
|
const { data } = await getUserList({ pageNo: 1, pageSize: 10 })
|
||||||
|
|
||||||
|
// 添加用户
|
||||||
|
await addUser({ userName: 'test', loginName: 'test' })
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📚 开发规范
|
||||||
|
|
||||||
|
项目包含完整的开发规范文档 `CLAUDE.md`，涵盖：
|
||||||
|
|
||||||
|
### 🎯 核心原则
|
||||||
|
- **可读性优先** - 代码是写给人看的
|
||||||
|
- **DRY原则** - 不重复造轮子
|
||||||
|
- **高内聚低耦合** - 模块化设计
|
||||||
|
|
||||||
|
### 📋 编码规范
|
||||||
|
- **命名规范** - 统一的命名约定
|
||||||
|
- **文件组织** - 清晰的目录结构
|
||||||
|
- **组件开发** - 组件开发最佳实践
|
||||||
|
- **API设计** - RESTful API 设计规范
|
||||||
|
|
||||||
|
### 🎨 图标使用规范
|
||||||
|
- **统一图标库** - 使用 `icon-park-outline` 图标库
|
||||||
|
- **语义化图标** - 图标含义与功能匹配
|
||||||
|
- **按钮必备** - 所有按钮必须配备图标
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🌍 国际化支持
|
||||||
|
|
||||||
|
项目内置完整的国际化支持：
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// 语言配置
|
||||||
|
const { t } = useI18n()
|
||||||
|
|
||||||
|
// 使用翻译
|
||||||
|
const title = t('common.confirm')
|
||||||
|
```
|
||||||
|
|
||||||
|
支持语言：
|
||||||
|
- 🇨🇳 简体中文
|
||||||
|
- 🇺🇸 English
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🎨 主题定制
|
||||||
|
|
||||||
|
### 🌙 主题切换
|
||||||
|
|
||||||
|
支持明暗主题无缝切换：
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// 主题切换
|
||||||
|
const { theme, toggleTheme } = useTheme()
|
||||||
|
```
|
||||||
|
|
||||||
|
### 🎨 样式定制
|
||||||
|
|
||||||
|
- **CSS变量** - 支持CSS变量定制
|
||||||
|
- **UnoCSS** - 原子化CSS，灵活定制
|
||||||
|
- **主题色** - 可配置的主题色彩方案
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📖 开发指南
|
||||||
|
|
||||||
|
### 🔧 添加新页面
|
||||||
|
|
||||||
|
1. 在 `src/views/` 创建页面组件
|
||||||
|
2. 在 `src/router/routes.static.ts` 添加路由配置
|
||||||
|
3. 配置权限要求（roles字段）
|
||||||
|
|
||||||
|
### 🔌 添加新API
|
||||||
|
|
||||||
|
1. 在 `src/service/api/` 定义接口
|
||||||
|
2. 使用项目封装的 alova 实例
|
||||||
|
3. 遵循统一的响应处理格式
|
||||||
|
|
||||||
|
### 🧩 添加新组件
|
||||||
|
|
||||||
|
1. 在 `src/components/` 创建组件
|
||||||
|
2. 使用 TypeScript 定义 Props 和 Emits
|
||||||
|
3. 遵循 Coi 组件命名规范
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🚀 部署指南
|
||||||
|
|
||||||
|
### 📦 构建优化
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 生产构建
|
||||||
|
pnpm build
|
||||||
|
|
||||||
|
# 分析打包体积
|
||||||
|
pnpm sizecheck
|
||||||
|
```
|
||||||
|
|
||||||
|
### 🐳 Docker 部署
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 使用 Docker Compose 部署
|
||||||
docker compose -f docker-compose.product.yml up --build -d
|
docker compose -f docker-compose.product.yml up --build -d
|
||||||
```
|
```
|
||||||
> 关于 nginx.conf 只供参考，你可以根据自己的需求进行调整。
|
|
||||||
|
|
||||||
## 相关项目
|
### 🌐 Nginx 配置
|
||||||
|
|
||||||
- [Nova-admin-nest](https://github.com/chansee97/nova-admin-nest) (开发中)基于TS, NestJs, typeorm的Nova-Admin配套后台项目
|
参考项目中的 `nginx.conf` 配置文件。
|
||||||
|
|
||||||
## 学习交流
|
---
|
||||||
|
|
||||||
Nova-Admin 是完全开源免费的项目，目前仍然在优化迭代中，旨在帮助开发者更方便地进行中大型管理系统开发，有使用问题欢迎在交流群内提问。
|
## 🤝 贡献指南
|
||||||
|
|
||||||
| Q群 | 微信群 |
|
我们欢迎所有形式的贡献！
|
||||||
| :--: |:--: |
|
|
||||||
| <img src="https://cdn.jsdelivr.net/gh/chansee97/static/nova-admin/q-group.png" width=170> |<img src="https://cdn.jsdelivr.net/gh/chansee97/static/wechat.png" width=170>|
|
|
||||||
|
|
||||||
> 添加微信请注明来意
|
### 🐛 问题反馈
|
||||||
|
|
||||||
## 贡献
|
如果你发现了 bug 或有功能建议：
|
||||||
|
|
||||||
如果您发现了任何问题或有改进建议，请创建一个[issue](nova-admin/issues/new)或提交一个PR。我们欢迎您的贡献！
|
1. 查看 [Issues](../../issues) 是否已有相关问题
|
||||||
|
2. 创建新的 Issue，详细描述问题或建议
|
||||||
|
3. 如果可能，提供复现步骤或期望行为
|
||||||
|
|
||||||
## 支持
|
### 💡 功能建议
|
||||||
|
|
||||||
如果感觉本项目对你工作或学习有帮助，请帮我点一个✨Star,这将是对我极大的鼓励与支持, 也可以在下方请我喝一杯咖啡
|
我们欢迎新功能建议：
|
||||||
|
|
||||||
| 微信 | 支付宝 |
|
1. 确保建议符合项目目标
|
||||||
| :--: |:--: |
|
2. 详细描述功能需求和使用场景
|
||||||
| <img src="https://cdn.jsdelivr.net/gh/chansee97/static/sponsor-wechat.png" width=170> | <img src="https://cdn.jsdelivr.net/gh/chansee97/static/sponsor-alipay.png" width=170>|
|
3. 如果可能，提供设计方案或原型
|
||||||
|
|
||||||
## 贡献者
|
### 🔧 代码贡献
|
||||||
|
|
||||||
感谢他们的所做的一切贡献！
|
1. Fork 本仓库
|
||||||
|
2. 创建新的功能分支: `git checkout -b feature/amazing-feature`
|
||||||
|
3. 提交你的更改: `git commit -m 'feat: add amazing feature'`
|
||||||
|
4. 推送到分支: `git push origin feature/amazing-feature`
|
||||||
|
5. 提交 Pull Request
|
||||||
|
|
||||||
<a href="https://github.com/chansee97/nova-admin/graphs/contributors">
|
### 📝 Commit 规范
|
||||||
<img src="https://contrib.rocks/image?repo=chansee97/nova-admin" alt="contributors" />
|
|
||||||
</a>
|
|
||||||
|
|
||||||
## Star 历史
|
请遵循 [Conventional Commits](https://conventionalcommits.org/) 规范：
|
||||||
|
|
||||||
[](https://star-history.com/#chansee97/nova-admin&Date)
|
```
|
||||||
|
feat: 新功能
|
||||||
|
fix: bug修复
|
||||||
|
docs: 文档更新
|
||||||
|
style: 代码格式调整
|
||||||
|
refactor: 代码重构
|
||||||
|
test: 测试相关
|
||||||
|
chore: 构建过程或辅助工具的变动
|
||||||
|
```
|
||||||
|
|
||||||
## 协议
|
---
|
||||||
|
|
||||||
[MIT](LICENSE)
|
## 📄 许可证
|
||||||
|
|
||||||
|
本项目基于 [MIT](LICENSE) 许可证开源。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🙏 致谢
|
||||||
|
|
||||||
|
感谢以下优秀的开源项目：
|
||||||
|
|
||||||
|
- [Vue.js](https://vuejs.org/) - 渐进式 JavaScript 框架
|
||||||
|
- [Vite](https://vitejs.dev/) - 下一代前端构建工具
|
||||||
|
- [Naive UI](https://www.naiveui.com/) - Vue 3 组件库
|
||||||
|
- [UnoCSS](https://unocss.dev/) - 原子化 CSS 引擎
|
||||||
|
- [Alova](https://alova.js.org/) - 轻量级请求策略库
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
<div align="center">
|
||||||
|
|
||||||
|
**如果这个项目对你有帮助，请给它一个 ⭐**
|
||||||
|
|
||||||
|
**让我们一起构建更好的后台管理系统！**
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user