docs: 5.0 英文自述
This commit is contained in:
pany
parent
ae8315586c
commit
c43ee2bb30
271
README.md
271
README.md
@ -1,159 +1,218 @@
|
|||||||
<div align="center">
|
<div align="center">
|
||||||
<img alt="V3 Admin Vite Logo" width="120" height="120" src="./src/common/assets/images/layouts/logo.png">
|
<img alt="Logo" width="120" height="120" src="./src/common/assets/images/layouts/logo.png">
|
||||||
<h1>V3 Admin Vite</h1>
|
<h1>V3 Admin Vite</h1>
|
||||||
<span>English | <a href="./README.zh-CN.md">中文</a></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
## ⚡ Introduction
|
<b>English | <a href="./README.zh-CN.md">中文</a></b>
|
||||||
|
|
||||||
V3 Admin Vite is a free and open source middle and background management system basic solution, based on mainstream framework such as Vue3, TypeScript, Element Plus, Pinia and Vite
|
## Introduction
|
||||||
|
|
||||||
- Vue Cli 5.x: [v3-admin](https://github.com/un-pany/v3-admin)
|
V3 Admin Vite is a free and open-source foundational solution for backend management systems, based on popular technologies such as Vue3, Vite, TypeScript, Element Plus, and others
|
||||||
- Electron desktop: [v3-electron-vite](https://github.com/un-pany/v3-electron-vite)
|
|
||||||
|
|
||||||
China repository: [Gitee](https://gitee.com/un-pany/v3-admin-vite)
|
## Notifications
|
||||||
|
|
||||||
## 📚 Document
|
> [!NOTE]
|
||||||
|
> Powered by love! All source code is free and open-source. If you find it helpful, feel free to give a star to support!
|
||||||
|
|
||||||
- Chinese documentation: [link](https://juejin.cn/post/7089377403717287972)
|
> [!IMPORTANT]
|
||||||
- Chinese getting started tutorial: [link](https://juejin.cn/column/7207659644487139387)
|
> Welcome to experience the brand-new version 5.0, currently in the beta stage. It will be a masterpiece!
|
||||||
|
|
||||||
## 📺 Online preview
|
> [!WARNING]
|
||||||
|
> Version 4.x will no longer be maintained unless there are critical bugs! [Click to switch to the 4.x branch](https://github.com/un-pany/v3-admin-vite/tree/4.x)
|
||||||
|
|
||||||
| Location | account | Link |
|
> [!TIP]
|
||||||
| ------------ | ------------------- | ----------------------------------------------- |
|
> Paid services are officially launched! If you don’t want to do it yourself but want to remove TS or other modules, try the lazy package! [Click to check it out](https://github.com/un-pany/v3-admin-vite/issues/225)
|
||||||
| github-pages | `admin` or `editor` | [link](https://un-pany.github.io/v3-admin-vite) |
|
|
||||||
|
|
||||||
## ❤️ Generate electricity with love
|
## Usage
|
||||||
|
|
||||||
- **Completely free**：But hopefully you order a star !!!
|
<details>
|
||||||
- **Very concise**：No complicated encapsulation, no complicated type gymnastics, out of the box
|
<summary>Recommended Environment</summary>
|
||||||
- **Detailed annotations**：Each configuration item is written with as detailed comments as possible
|
|
||||||
- **Latest dependencies**: Regularly update all third-party dependencies to the latest version
|
|
||||||
- **Very specification**: The code style is unified, the naming style is unified, and the comment style is unified
|
|
||||||
|
|
||||||
## Feature
|
<br>
|
||||||
|
|
||||||
- **Vue3**：The latest Vue3 composition API using Vue3 + script setup
|
- Latest version of `Visual Studio Code`
|
||||||
- **Element Plus**：Vue3 version of Element UI
|
- Install the recommended plugins in the `.vscode/extensions.json` file
|
||||||
- **Pinia**: An alternative to Vuex in Vue3
|
- `node` 20.x or 22+
|
||||||
- **Vite**：Really fast
|
- `pnpm` 9+
|
||||||
- **Vue Router**：router
|
|
||||||
- **TypeScript**：JavaScript With Syntax For Types
|
|
||||||
- **pnpm**：Faster, disk space saving package management tool
|
|
||||||
- **Scss**：Consistent with Element Plus
|
|
||||||
- **CSS variable**：Mainly controls the layout and color of the item
|
|
||||||
- **ESlint**：Code verification, Code formatting
|
|
||||||
- **Axios**: Promise based HTTP client (encapsulated)
|
|
||||||
- **UnoCSS**: Real-time atomized CSS engine with high performance and flexibility
|
|
||||||
- **Mobile Compatible**: The layout is compatible with mobile page resolution
|
|
||||||
|
|
||||||
## Functions
|
</details>
|
||||||
|
|
||||||
- **User management**: Log in and out of the demo
|
<details>
|
||||||
- **Authority management**: Page-level permissions (dynamic routing), button-level permissions (directive permissions, permission functions), and route navigation guards
|
<summary>Local Development</summary>
|
||||||
- **Multiple Environments**: Development, Staging, Production
|
|
||||||
- **Multiple themes**: Normal, Dark, Dark Blue, three theme modes
|
|
||||||
- **Multiple layouts**：Left, Top, Left Top, three layout modes
|
|
||||||
- **Error page**: 403, 404
|
|
||||||
- **Dashboard**: Display different Dashboard pages according to different users
|
|
||||||
- **Other functions**：SVG, Dynamic Sidebar, Dynamic Breadcrumb Navigation, Tabbed Navigation, Screenfull, Adaptive Shrink Sidebar, Composable
|
|
||||||
|
|
||||||
## 🚀 Development
|
<br>
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# configure
|
# Clone the project
|
||||||
1. installation of the recommended plugins in the .vscode directory
|
|
||||||
2. node version 18.x or 20+
|
|
||||||
3. pnpm version 8.x or latest
|
|
||||||
|
|
||||||
# clone
|
|
||||||
git clone https://github.com/un-pany/v3-admin-vite.git
|
git clone https://github.com/un-pany/v3-admin-vite.git
|
||||||
|
|
||||||
# enter the project directory
|
# Enter the project directory
|
||||||
cd v3-admin-vite
|
cd v3-admin-vite
|
||||||
|
|
||||||
# install dependencies
|
# Install dependencies
|
||||||
pnpm i
|
pnpm i
|
||||||
|
|
||||||
# start the service
|
# Start the development server
|
||||||
pnpm dev
|
pnpm dev
|
||||||
```
|
```
|
||||||
|
|
||||||
## ✔️ Preview
|
</details>
|
||||||
|
|
||||||
|
<details>
|
||||||
|
<summary>Build for Production</summary>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# staging environment
|
# Build for the staging environment
|
||||||
pnpm preview:staging
|
|
||||||
|
|
||||||
# production environment
|
|
||||||
pnpm preview
|
|
||||||
```
|
|
||||||
|
|
||||||
## 📦️ Multi-environment packaging
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# build the staging environment
|
|
||||||
pnpm build:staging
|
pnpm build:staging
|
||||||
|
|
||||||
# build the production environment
|
# Build for the production environment
|
||||||
pnpm build
|
pnpm build
|
||||||
```
|
```
|
||||||
|
|
||||||
## 🔧 Code inspection
|
</details>
|
||||||
|
|
||||||
|
<details>
|
||||||
|
<summary>Local Preview</summary>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# code formatting
|
# Execute the build command first to generate the dist directory, then run the preview command
|
||||||
|
pnpm preview
|
||||||
|
```
|
||||||
|
|
||||||
|
</details>
|
||||||
|
|
||||||
|
<details>
|
||||||
|
<summary>Code Check</summary>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Code linting and formatting
|
||||||
pnpm lint
|
pnpm lint
|
||||||
|
|
||||||
# unit test
|
# Unit tests
|
||||||
pnpm test
|
pnpm test
|
||||||
```
|
```
|
||||||
|
|
||||||
## Git commit specification reference
|
</details>
|
||||||
|
|
||||||
- `feat` add new functions
|
<details>
|
||||||
- `fix` Fix issues/bugs
|
<summary>Commit Guidelines</summary>
|
||||||
- `perf` Optimize performance
|
|
||||||
- `style` Change the code style without affecting the running result
|
|
||||||
- `refactor` Re-factor code
|
|
||||||
- `revert` Undo changes
|
|
||||||
- `test` Test related, does not involve changes to business code
|
|
||||||
- `docs` Documentation and Annotation
|
|
||||||
- `chore` Updating dependencies/modifying scaffolding configuration, etc.
|
|
||||||
- `workflow` Work flow Improvements
|
|
||||||
- `ci` CICD
|
|
||||||
- `types` Type definition
|
|
||||||
- `wip` In development
|
|
||||||
|
|
||||||
## Project preview
|
<br>
|
||||||
|
|
||||||
|
`feat` New feature
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## 💕 Contributors
|
`fix` Bug fix
|
||||||
|
|
||||||
Thanks to all the contributors!
|
`perf` Performance improvement
|
||||||
|
|
||||||
|
`refactor` Code refactoring
|
||||||
|
|
||||||
|
`docs` Documentation and comments
|
||||||
|
|
||||||
|
`types` Type-related changes
|
||||||
|
|
||||||
|
`test` Unit tests related
|
||||||
|
|
||||||
|
`ci` Continuous integration, workflows
|
||||||
|
|
||||||
|
`revert` Revert changes
|
||||||
|
|
||||||
|
`chore` Chores (update dependencies, modify configurations, etc)
|
||||||
|
|
||||||
|
</details>
|
||||||
|
|
||||||
|
## Links
|
||||||
|
|
||||||
|
**Online Preview**：[github-pages](https://un-pany.github.io/v3-admin-vite)
|
||||||
|
|
||||||
|
**Chinese Documentation**：[link](https://juejin.cn/post/7089377403717287972)
|
||||||
|
|
||||||
|
**Zero to Hero Tutorial**：[link](https://juejin.cn/column/7207659644487139387)
|
||||||
|
|
||||||
|
**Electron Desktop Version**: [v3-electron-vite](https://github.com/un-pany/v3-electron-vite)
|
||||||
|
|
||||||
|
**Domestic Repository**：[gitee](https://gitee.com/un-pany/v3-admin-vite)
|
||||||
|
|
||||||
|
**Optional Group**：[check how to join](https://github.com/un-pany/v3-admin-vite/issues/191)
|
||||||
|
|
||||||
|
**Donations**：[buy a coffee for the author](https://github.com/un-pany/v3-admin-vite/issues/69)
|
||||||
|
|
||||||
|
**Releases & Changelog**：[releases](https://github.com/un-pany/v3-admin-vite/releases)
|
||||||
|
|
||||||
|
## Features
|
||||||
|
|
||||||
|
**Simplified structure**: No complex encapsulation, no complicated type gymnastics, just enough to meet the needs
|
||||||
|
|
||||||
|
**Detailed comments**: Every configuration item comes with as detailed comments as possible
|
||||||
|
|
||||||
|
**Latest dependencies**: Keeps all third-party dependencies up to date
|
||||||
|
|
||||||
|
**Consistency**: Unified code style, naming conventions, and comment style
|
||||||
|
|
||||||
|
## Built-in Features
|
||||||
|
|
||||||
|
**User Management**: Login, logout demonstration
|
||||||
|
|
||||||
|
**Permission Management**: Page-level permissions (dynamic routing), button-level permissions (directive permissions, permission functions), route guards
|
||||||
|
|
||||||
|
**Multiple Environments**: Development, staging, and production environments
|
||||||
|
|
||||||
|
**Multiple Themes**: Normal, dark, and deep blue themes
|
||||||
|
|
||||||
|
**Multiple Layouts**: Left-side, top, and hybrid layouts
|
||||||
|
|
||||||
|
**Homepage**: Different dashboard pages for different users
|
||||||
|
|
||||||
|
**Error Pages**: 403, 404
|
||||||
|
|
||||||
|
**Mobile Compatibility**: Layouts compatible with mobile screen resolutions
|
||||||
|
|
||||||
|
**Others**: SVG sprite sheet, dynamic sidebar, dynamic breadcrumbs, tab navigation, content zoom and fullscreen, composable functions
|
||||||
|
|
||||||
|
## Tech Stack
|
||||||
|
|
||||||
|
**Vue3**: Vue3 + script setup with the latest Vue3 Composition API
|
||||||
|
|
||||||
|
**Element Plus**: The Vue3 version of Element UI
|
||||||
|
|
||||||
|
**Pinia**: The legendary Vuex5
|
||||||
|
|
||||||
|
**Vite**: Really fast
|
||||||
|
|
||||||
|
**Vue Router**: The routing system
|
||||||
|
|
||||||
|
**TypeScript**: A superset of JavaScript
|
||||||
|
|
||||||
|
**pnpm**: A faster, disk-space-saving package manager
|
||||||
|
|
||||||
|
**Scss**: Consistent with Element Plus
|
||||||
|
|
||||||
|
**CSS Variables**: Primarily controls layout and color in the project
|
||||||
|
|
||||||
|
**ESlint**: Code linting and formatting
|
||||||
|
|
||||||
|
**Axios**: Sends network requests (pre-packaged)
|
||||||
|
|
||||||
|
**UnoCSS**: A high-performance, flexible atomic CSS engine
|
||||||
|
|
||||||
|
## Project Preview Image
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## Contributors
|
||||||
|
|
||||||
|
A big thank you to all the contributors!
|
||||||
|
|
||||||
<a href="https://github.com/un-pany/v3-admin-vite/graphs/contributors">
|
<a href="https://github.com/un-pany/v3-admin-vite/graphs/contributors">
|
||||||
<img src="https://contrib.rocks/image?repo=un-pany/v3-admin-vite" />
|
<img src="https://contrib.rocks/image?repo=un-pany/v3-admin-vite">
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
## 💕 Thanks star
|
## License
|
||||||
|
|
||||||
Small projects are not easy to get a star, if you like this project, welcome to support a star! This is the only motivation for the author to maintain it on an ongoing basis (whisper: it's free after all)
|
[MIT](./LICENSE) License © 2022-PRESENT [pany](https://github.com/pany-ang)
|
||||||
|
|
||||||
## ☕ Donate
|
|
||||||
|
|
||||||
[See how to donate](https://github.com/un-pany/v3-admin-vite/issues/69)
|
|
||||||
|
|
||||||
## Group
|
|
||||||
|
|
||||||
[See how to join a group chat](https://github.com/un-pany/v3-admin-vite/issues/191)
|
|
||||||
|
|
||||||
## 📄 License
|
|
||||||
|
|
||||||
[MIT](./LICENSE)
|
|
||||||
|
|
||||||
Copyright (c) 2022-present [pany](https://github.com/pany-ang)
|
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
<div align="center">
|
<div align="center">
|
||||||
<img alt="V3 Admin Vite Logo" width="120" height="120" src="./src/common/assets/images/layouts/logo.png">
|
<img alt="Logo" width="120" height="120" src="./src/common/assets/images/layouts/logo.png">
|
||||||
<h1>V3 Admin Vite</h1>
|
<h1>V3 Admin Vite</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user