提交 ee5fb223 编写于 作者: V Vben

chore: update readme.md

上级 381e3a96
......@@ -6,8 +6,9 @@ end_of_line=lf
insert_final_newline=true
indent_style=space
indent_size=2
max_line_length = 100
[*.yml]
[*.{yml,yaml,json}]
indent_style = space
indent_size = 2
......
---
name: 🐛 Bug report
about: Create a report to help us improve
labels: 🔍 status/open, 🐛 type/bug
title: ''
labels: 'bug: pending triage'
assignees: ''
---
<!--
抱歉,您遇到了一个错误。感谢您抽出宝贵的时间进行举报!
请尽可能填写以下模板。
Ouch, sorry you’ve run into a bug. Thank for taking the time to report it!
Please fill in as much of the template below as you’re able.
P.S. have you seen our support and contributing docs?
https://github.com/get-alex/.github/blob/master/support.md
https://github.com/get-alex/.github/blob/master/contributing.md
-->
### Subject of the issue
Describe your issue here.
### Your environment
- **OS**: <!-- Name and version of operating system -->
- **Packages**: <!-- Names and version of required packages -->
- **Env**: <!-- Version of node, npm, yarn, or names and versions of browser -->
**⚠️ IMPORTANT ⚠️ Please check the following list before proceeding. If you ignore this issue template, your issue will be directly closed.**
### Steps to reproduce
- [ ] Read [the docs](https://anncwb.github.io/vue-vben-admin-doc/).
- [ ] Make sure the code is up to date. (Some bugs have been fixed in the latest code)
- [ ] This is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/anncwb/vue-vben-admin/discussions) or join our [Discord](https://discord.gg/8GuAdwDhj6) Chat Server.
Tell us how to reproduce this issue. Please provide a working and simplified example.
### Describe the bug
🎉 BONUS POINTS for creating a [minimal reproduction](https://stackoverflow.com/help/mcve) and uploading it to GitHub. This will get you the fastest support. 🎉
A clear and concise description of what the bug is..
### Expected behaviour
### Reproduction
What should happen?
Please describe the steps of the problem in detail to ensure that we can restore the correct problem
### Actual behaviour
## System Info
What happens instead?
- Operating System:
- Node version:
- Package manager (npm/yarn/pnpm) and version:
---
name: 🚀 Feature request
about: Suggest an idea for this project
labels: 🔍 status/open, 🦋 type/enhancement
title: ''
labels: ''
assignees: ''
---
<!--
Thank you for suggesting an idea to make this project better!
感谢您提出使这个项目更好的想法!
请尽可能填写以下模板。
Thank you for suggesting an idea to make this project better!
Please fill in as much of the template below as you’re able.
-->
......
---
name: Question 🤔
about: Usage question or discussion about alex.
labels: 🔍 status/open, 🙋 type/question
---
<!--
To make it easier for us to help you, please include as much useful information
as possible.
Before opening a new issue, please search existing issues:
https://github.com/search?q=org%3Aget-alex&type=Issues
-->
blank_issues_enabled: false
contact_links:
- name: Discord Chat
url: https://discord.gg/8GuAdwDhj6
about: Ask questions and discuss with other Vben users in real time.
- name: Questions & Discussions
url: https://github.com/anncwb/vue-vben-admin/discussions
about: Use GitHub discussions for message-board style questions and discussions.
......@@ -6,53 +6,53 @@ on:
- main
jobs:
push-to-ftp:
if: "contains(github.event.head_commit.message, '[deploy]')"
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v2
- name: Sed Config Base
shell: bash
run: |
sed -i 's#VITE_PUBLIC_PATH\s*=.*#VITE_PUBLIC_PATH = /next/#g' ./.env.production
sed -i "s#VITE_BUILD_COMPRESS\s*=.*#VITE_BUILD_COMPRESS = 'gzip'#g" ./.env.production
cat ./.env.production
- name: use Node.js 14
uses: actions/setup-node@v2.1.2
with:
node-version: '14.x'
- name: Get yarn cache
id: yarn-cache
run: echo "::set-output name=dir::$(yarn cache dir)"
- name: Cache dependencies
uses: actions/cache@v2
with:
path: ${{ steps.yarn-cache.outputs.dir }}
key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
restore-keys: |
${{ runner.os }}-yarn-
- name: Build
run: |
yarn install
yarn run build
- name: Deploy
uses: SamKirkland/FTP-Deploy-Action@2.0.0
env:
FTP_SERVER: ${{ secrets.FTP_SERVER }}
FTP_USERNAME: ${{ secrets.FTP_USERNAME }}
FTP_PASSWORD: ${{ secrets.FTP_PASSWORD }}
METHOD: sftp
PORT: ${{ secrets.FTP_PORT }}
LOCAL_DIR: dist
REMOTE_DIR: /srv/www/vben-admin
ARGS: --delete --verbose --parallel=80
# push-to-ftp:
# if: "contains(github.event.head_commit.message, '[deploy]')"
# runs-on: ubuntu-latest
# steps:
# - name: Checkout
# uses: actions/checkout@v2
# - name: Sed Config Base
# shell: bash
# run: |
# sed -i 's#VITE_PUBLIC_PATH\s*=.*#VITE_PUBLIC_PATH = /next/#g' ./.env.production
# sed -i "s#VITE_BUILD_COMPRESS\s*=.*#VITE_BUILD_COMPRESS = 'gzip'#g" ./.env.production
# cat ./.env.production
# - name: use Node.js 14
# uses: actions/setup-node@v2.1.2
# with:
# node-version: '14.x'
# - name: Get yarn cache
# id: yarn-cache
# run: echo "::set-output name=dir::$(yarn cache dir)"
# - name: Cache dependencies
# uses: actions/cache@v2
# with:
# path: ${{ steps.yarn-cache.outputs.dir }}
# key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
# restore-keys: |
# ${{ runner.os }}-yarn-
# - name: Build
# run: |
# yarn install
# yarn run build
# - name: Deploy
# uses: SamKirkland/FTP-Deploy-Action@2.0.0
# env:
# FTP_SERVER: ${{ secrets.FTP_SERVER }}
# FTP_USERNAME: ${{ secrets.FTP_USERNAME }}
# FTP_PASSWORD: ${{ secrets.FTP_PASSWORD }}
# METHOD: sftp
# PORT: ${{ secrets.FTP_PORT }}
# LOCAL_DIR: dist
# REMOTE_DIR: /srv/www/vben-admin
# ARGS: --delete --verbose --parallel=80
push-to-gh-pages:
if: "contains(github.event.head_commit.message, '[deploy]')"
......
ports:
- port: 3344
onOpen: open-preview
tasks:
- init: yarn
command: yarn dev
## 2.0.1 (2021-03-04)
## 2.0.2 (2021-03-04)
### ✨ Refactor
......
## 2.0.1 (2021-03-04)
## 2.0.2 (2021-03-04)
### ✨ Refactor
......
<p align="center">
<a href="https://github.com/anncwb/vue-vben-admin" target="_blank">
<img alt="VbenAdmin Logo" width="200" src="/anncwb/vue-vben-admin/raw/main/.github/res/imgs/logo.png">
</a>
</p>
<h2 align="center">VUE VBEN ADMIN2.0</h2>
[Chinese](./README.zh-CN.md) | **English**
[CHANGELOG](CHANGELOG.en_US.md)
- [Introduction](#introduction)
- [GitHub](#github)
- [Thin](#thin)
- [Preview](#preview)
- [Documentation](#documentation)
- [Preinstallation](#preinstallation)
- [Environmental requirements](#environmental-requirements)
- [UI framework](#ui-framework)
- [Icon](#icon)
- [Plugin](#plugin)
- [Suggested development environment](#suggested-development-environment)
- [Install](#install)
- [Usage](#usage)
- [Development environment](#development-environment)
- [Build](#build)
- [Format](#format)
- [Other](#other)
- [Git submit specifications](#git-submit-specifications)
- [Code contribution](#code-contribution)
- [Finished features](#finished-features)
- [Developing features](#developing-features)
- [Browser support](#browser-support)
- [Plugins](#plugins)
<div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="200" height="200" src="https://anncwb.github.io/anncwb/images/logo.png"> </a> <br> <br>
## Introduction
[![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE)
The project is based on the vue3 style background management system implemented by ʻant-design-vue`, `typescript`,`vue3.0`,`vite`,`tsx`,
<h1>Vue vben admin</h1>
</div>
## GitHub
**English** | [中文](./README.zh-CN.md)
[vue-vben-admin2.0](https://github.com/anncwb/vue-vben-admin) - `main` branch
## Introduction
### Thin
Vue Vben Admin is a free and open source middle and back-end template. Using the latest `vue3`, `vite2`, `TypeScript` and other mainstream technology development, the out-of-the-box middle and back-end front-end solutions can also be used for learning reference.
[vue-vben-admin-thin-next](https://github.com/anncwb/vben-admin-thin-next)
## Feature
## Preview
- **State of The Art Development**:Use front-end front-end technology development such as Vue3/vite2
- **TypeScript**: Application-level JavaScript language
- **Theming**: Configurable themes
- **International**:Built-in complete internationalization program
- **Mock Server** Built-in mock data scheme
- **Authority** Built-in complete dynamic routing permission generation scheme.
- **Component** Multiple commonly used components are encapsulated twice
- [2.0 preview](https://vvbin.cn/next/)
## 预览
- [2.0 Thin Preview](https://vvbin.cn/thin/next/)
- [vue-vben-admin](https://vvbin.cn/next/) - Full version Chinese site
- [vue-vben-admin-gh-pages](https://anncwb.github.io/vue-vben-admin/) - Full version of the github site
- [vben-admin-thin-next](https://vvbin.cn/thin/next/) - Simplified Chinese site
- [vben-admin-thin-gh-pages](https://anncwb.github.io/vben-admin-thin-next/) -Simplified github site
Account for test: vben/123456
Test account: vben/123456
<p align="center">
<img alt="VbenAdmin Logo" width="100%" src="./.github/res/imgs/preview1.png">
<img alt="VbenAdmin Logo" width="100%" src="./.github/res/imgs/preview2.png">
<img alt="VbenAdmin Logo" width="100%" src="./.github/res/imgs/preview3.png">
<img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview1.png">
<img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview2.png">
<img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview3.png">
</p>
## Documentation
The documentation for 2.0 hasn't started yet, it will be provided later.
## Preinstallation
### Environmental requirements
- `Node.js`: - Version > `12.0.0` .
- `yarn` : - Package management tool.
### UI framework
### Use Gitpod
- [Tailwind CSS](https://tailwindcss.com/) - 2.0.0-beta.5 has deleted.
- [Ant Design Vue 2.0](https://2x.antdv.com/docs/vue/introduce-cn/)
Open the project in Gitpod (free online dev environment for GitHub) and start coding immediately.
### Icon
[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/anncwb/vue-vben-admin)
- [Ant Design Vue Icon Component](https://2x.antdv.com/components/icon-cn/) - Icon which is imported on demand.
- [Iconify](https://iconify.design) - Icon can be used [Icônes](https://icones.netlify.app/)
- [PurgeIcons](https://github.com/antfu/purge-icons) - Icon which is used by build.
## Documentation
### Plugin
[Document](https://vvbin.cn/doc-next/)
- [Vue Router Next](https://github.com/vuejs/vue-router-next)
- [Vuex Next](https://github.com/vuejs/vuex)
- [vuex-module-decorators](https://github.com/championswimmer/vuex-module-decorators) - vuex modular
- [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock) - Mock plugin base on vite
- [vue-i18n](https://github.com/intlify/vue-i18n-next) - Internationalization
- [lodash-es](https://github.com/lodash/lodash) - JavaScript utility library
- [axios](https://github.com/axios/axios) - Http data interaction
- [TypeScript](https://www.typescriptlang.org/)
## Preparation
### Suggested development environment
- [node](http://nodejs.org/) and [git](https://git-scm.com/) - Project development environment
- [Vite](https://vitejs.dev/) - Familiar with vite features
- [Vue3](https://v3.vuejs.org/) - Familiar with Vue basic syntax
- [TypeScript](https://www.typescriptlang.org/) - Familiar with the basic syntax of `TypeScript`
- [Es6+](http://es6.ruanyifeng.com/) - Familiar with es6 basic syntax
- [Vue-Router-Next](https://next.router.vuejs.org/) - Familiar with the basic use of vue-router
- [Ant-Design-Vue](https://2x.antdv.com/docs/vue/introduce-cn/) - ui basic use
- [Mock.js](https://github.com/nuysoft/Mock) - mockjs basic syntax
- `Git`: - Tool of version management
- `Visual Studio Code` - (VSCode): Latest version
- [VS Code Extensions](./.vscode/extensions.json)
- [Iconify IntelliSense](https://marketplace.visualstudio.com/items?itemName=antfu.iconify)
- [Tailwind CSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss) - Tailwind css style association
- [Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur) - Essential for vue development
- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) - Checking script code
- [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - Code formatting
- [Stylelint](https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint) - Css formatting
## Install and use
## Install
- Get the project code
```bash
# Make git case sensitive to file names
git config core.ignorecase false
git clone https://github.com/anncwb/vue-vben-admin.git
```
# Pull code of the project
git clone https://github.com/anncwb/vue-vben-admin.git vue-vben-admin-2.0
- Installation dependencies
cd vue-vben-admin-2.0
```bash
cd vue-vben-admin
# If you use other package management tool, you can install it by yourself
# if you hasn't install yarn, please run: npm install -g yarn
yarn install
```
## Usage
### Development environment
- run
```bash
yarn serve
```
### Build
- build
```bash
yarn build # build
yarn build:no-cache # build, cache will be removed before build
yarn report # Generate build package report preview
yarn build
```
### Format
```bash
yarn lint:stylelint # css formatting
## Change Log
yarn lint:prettier # js/ts code formatting
```
[CHANGELOG](./CHANGELOG.zh_CN.md)
### Other
## Project
```bash
yarn reinstall # Remove dependencies and reinstall, supported window
- [vue-vben-admin](https://github.com/anncwb/vue-vben-admin) - full version
- [vue-vben-admin-thin-next](https://github.com/anncwb/vben-admin-thin-next) - Simplified version
yarn preview # Build and preview in local
## How to contribute
yarn log # Generate CHANGELOG
You are very welcome to join![Raise an issue](https://github.com/anncwb/vue-vben-admin/issues/new/choose) Or submit a Pull Request。
yarn clean:cache # Delete cache
**Pull Request:**
yarn clean:lib # Delete node_modules, supported window
```
1. Fork code!
2. Create your own branch: `git checkout -b feat/xxxx`
3. Submit your changes: `git commit -am 'feat(function): add xxxxx'`
4. Push your branch: `git push origin feat/xxxx`
5. submit`pull request`
## Git submit specifications
## Git Contribution submission specification
- Refer to [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) specifications ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
- reference [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) specification ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
- `feat` Add new features
- `fix` Fix problem/BUG
- `style` Code style related and doesn't affect the running result
- `fix` Fix the problem/BUG
- `style` The code style is related and does not affect the running result
- `perf` Optimization/performance improvement
- `refactor` Refactor
- `revert` Undo edit
- `test` Test related
- `docs` Documentation/notes
- `chore` Dependent update/scaffolding configuration modification etc
- `chore` Dependency update/scaffolding configuration modification etc.
- `workflow` Workflow improvements
- `ci` Continuous integration
- `types` Update file of type definition
- `wip` Developing
- `types` Type definition file changes
- `wip` In development
## Code contribution
## Related warehouse
1. Fork code!
2. Create your own branch: `git checkout -b feat/xxxx`
3. Submit your changes: `git commit -am 'feat(function): add xxxxx'`
4. Push your branch: `git push origin feat/xxxx`
5. submit`pull request`
If these plugins are helpful to you, you can give a star support
## Finished features
- [x] Project construction (based on vite))
- [x] Login and exit
- [x] Menu (can search, drag and drop and menu layout)
- [x] Multiple tabs/breadcrumbs
- [x] Permission management base on role
- [x] Permission management base on background
- [x] The separation of routing and menu settings
- [x] Collapsible sidebar
- [x] Draggable sidebar
- [x] Multi-tab mode/global control
- [x] Menu search
- [x] Page loading
- [x] Scroll bar component
- [x] Pop-up window expansion (dragable, full screen, adaptive height)
- [x] Mock data
- [x] hook Package
- [x] Form component
- [x] Right-click menu
- [x] Watermark plugin
- [x] Animation component
- [x] QR code plugin
- [x] Internationalization plugin
- [x] Details component
- [x] Validation component
- [x] Tree component
- [x] Picture preview component
- [x] Table component
- [x] Chart library
- [x] Digital animation
- [x] First screen loading waiting animation
- [x] Extract the production environment profile
- [x] Build Gzip
- [x] System performance optimization
- [x] Data import and export
- [x] Global error handling
- [x] Rich text component
- [x] Upload component
## Developing features
- [ ] Theme configuration
- [ ] Dark theme
- [ ] Build CDN
If you have more components/functions/suggestions/bugs/, welcome to submit pr or issue.
- [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock) - Used for local and development environment data mock
- [vite-plugin-html](https://github.com/anncwb/vite-plugin-html) - Used for html template conversion and compression
- [vite-plugin-style-import](https://github.com/anncwb/vite-plugin-style-import) - Used for component library style introduction on demand
- [vite-plugin-theme](https://github.com/anncwb/vite-plugin-theme) - Used to pack compressed image resources
- [vite-plugin-imagemin](https://github.com/anncwb/vite-plugin-imagemin) - Used for online switching of theme colors and other color-related configurations
- [vite-plugin-compression](https://github.com/anncwb/vite-plugin-compression) - Used to pack input .gz|.brotil files
## Browser support
It is recommended to use the `Chrome` browser for local development. Development in the Firefox browser is relatively slow.
The `Chrome 80+` browser is recommended for local development
Support modern browsers, Not currently supported ie11,Follow-up consideration support ie11
Support modern browsers, not IE
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
| :-: | :-: | :-: | :-: | :-: |
| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
More browsers can view [Can I Use Es Module](https://caniuse.com/?search=ES%20Module)
## Maintainer
[@Vben](https://github.com/anncwb)
## Donate
If you think this project is helpful to you, you can help the author buy a cup of coffee to show your support!
![donate](https://anncwb.github.io/anncwb/images/sponsor.png)
[Paypal Me](https://www.paypal.com/paypalme/cvvben)
## Discord
## Plugins
- [github discussions](https://github.com/anncwb/vue-vben-admin/discussions)
- [Discord](https://discord.gg/8GuAdwDhj6)
If these plugins are helpful to you, you can give a star
## License
- [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock)
- [vite-plugin-html](https://github.com/anncwb/vite-plugin-html)
- [vite-plugin-style-import](https://github.com/anncwb/vite-plugin-style-import)
- [vite-plugin-theme](https://github.com/anncwb/vite-plugin-theme)
- [vite-plugin-imagemin](https://github.com/anncwb/vite-plugin-imagemin)
- [vite-plugin-compression](https://github.com/anncwb/vite-plugin-compression)
[MIT © Vben-2020](./LICENSE)
<p align="center">
<a href="https://github.com/anncwb/vue-vben-admin" target="_blank">
<img alt="VbenAdmin Logo" width="200" src="./.github/res/imgs/logo.png">
</a>
</p>
<h2 align="center">VUE VBEN ADMIN2.0</h2>
**中文** | [English](./README.md)
[更新日志](CHANGELOG.zh_CN.md)
- [介绍](#介绍)
- [gitHub 地址](#github-地址)
- [精简版地址](#精简版地址)
- [预览地址](#预览地址)
- [文档](#文档)
- [预安装](#预安装)
- [环境要求](#环境要求)
- [UI 框架](#ui-框架)
- [图标](#图标)
- [插件](#插件)
- [建议开发环境](#建议开发环境)
- [安装](#安装)
- [使用](#使用)
- [开发环境](#开发环境)
- [打包](#打包)
- [格式化](#格式化)
- [其他](#其他)
- [Git 提交规范](#git-提交规范)
- [代码贡献](#代码贡献)
- [已完成功能](#已完成功能)
- [正在开发的功能](#正在开发的功能)
- [浏览器支持](#浏览器支持)
- [插件](#插件-1)
- [加入我们](#加入我们)
<div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="200" height="200" src="https://anncwb.github.io/anncwb/images/logo.png"> </a> <br> <br>
## 介绍
[![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE)
项目基于`ant-design-vue`,`typescript`,`vue3.0`,`vite`,`tsx`实现的 vue3 风格的后台管理系统,
<h1>Vue vben admin</h1>
</div>
## gitHub 地址
**中文** | [English](./README.md)
[vue-vben-admin2.0](https://github.com/anncwb/vue-vben-admin) - `main` 分支
## 简介
### 精简版地址
Vue Vben Admin 是一个免费开源的中后台模版。使用了最新的`vue3`,`vite2`,`TypeScript`等主流技术开发,开箱即用的中后台前端解决方案,也可用于学习参考。
[vue-vben-admin-thin-next](https://github.com/anncwb/vben-admin-thin-next)
## 特性
## 预览地址
- **最新技术栈**:使用 Vue3/vite2 等前端前沿技术开发
- **TypeScript**: 应用程序级 JavaScript 的语言
- **主题**:可配置的主题
- **国际化**:内置完善的国际化方案
- **Mock 数据** 内置 Mock 数据方案
- **权限** 内置完善的动态路由权限生成方案
- **组件** 二次封装了多个常用的组件
- [2.0 在线预览](https://vvbin.cn/next/)
## 预览
- [2.0 精简版 在线预览](https://vvbin.cn/thin/next/)
- [vue-vben-admin](https://vvbin.cn/next/) - 完整版中文站点
- [vue-vben-admin-gh-pages](https://anncwb.github.io/vue-vben-admin/) - 完整版 github 站点
- [vben-admin-thin-next](https://vvbin.cn/thin/next/) - 简化版中文站点
- [vben-admin-thin-gh-pages](https://anncwb.github.io/vben-admin-thin-next/) - 简化版 github 站点
测试账号: vben/123456
<p align="center">
<img alt="VbenAdmin Logo" width="100%" src="./.github/res/imgs/preview1.png">
<img alt="VbenAdmin Logo" width="100%" src="./.github/res/imgs/preview2.png">
<img alt="VbenAdmin Logo" width="100%" src="./.github/res/imgs/preview3.png">
<img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview1.png">
<img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview2.png">
<img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview3.png">
</p>
## 文档
[文档地址,持续更新中。。,](https://vvbin.cn/doc-next/)
## 预安装
### 环境要求
### 使用 Gitpod
- `Node.js`: - 版本大于 `12.0.0`
- `yarn` : - 包管理工具.
在 Gitpod(适用于 GitHub 的免费在线开发环境)中打开项目,并立即开始编码.
### UI 框架
[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/anncwb/vue-vben-admin)
- [Tailwind CSS](https://tailwindcss.com/) - 2.0.0-beta.5 已删除
- [Ant Design Vue 2.0](https://2x.antdv.com/docs/vue/introduce-cn/)
### 图标
- [Ant Design Vue Icon Component](https://2x.antdv.com/components/icon-cn/) - 按需引入所需图标.
- [Iconify](https://iconify.design) - 使用任何图标集中的图标 [Icônes](https://icones.netlify.app/)
- [PurgeIcons](https://github.com/antfu/purge-icons) - 仅打包所使用到的图标.
### 插件
## 文档
- [Vue Router Next](https://github.com/vuejs/vue-router-next)
- [Vuex Next](https://github.com/vuejs/vuex)
- [vuex-module-decorators](https://github.com/championswimmer/vuex-module-decorators) - vuex 模块化
- [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock) - 基于 vite 的 mock 插件.
- [vue-i18n](https://github.com/intlify/vue-i18n-next) - 国际化
- [lodash-es](https://github.com/lodash/lodash) - JavaScript 实用程序库
- [axios](https://github.com/axios/axios) - Http 数据交互
- [TypeScript](https://www.typescriptlang.org/)
[文档地址](https://vvbin.cn/doc-next/)
### 建议开发环境
## 准备
- `Git`: - 版本管理工具
- `Visual Studio Code` - (VSCode): 最新版本
- [VS Code Extensions](./.vscode/extensions.json)
- [Iconify IntelliSense](https://marketplace.visualstudio.com/items?itemName=antfu.iconify)
- [Tailwind CSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss) - Tailwind Css 样式联想
- [Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur) - vue 开发必备
- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) - 脚本代码检查
- [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - 代码格式化
- [Stylelint](https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint) - css 格式化
- [node](http://nodejs.org/)[git](https://git-scm.com/) -项目开发环境
- [Vite](https://vitejs.dev/) - 熟悉 vite 特性
- [Vue3](https://v3.vuejs.org/) - 熟悉 Vue 基础语法
- [TypeScript](https://www.typescriptlang.org/) - 熟悉`TypeScript`基本语法
- [Es6+](http://es6.ruanyifeng.com/) - 熟悉 es6 基本语法
- [Vue-Router-Next](https://next.router.vuejs.org/) - 熟悉 vue-router 基本使用
- [Ant-Design-Vue](https://2x.antdv.com/docs/vue/introduce-cn/) - ui 基本使用
- [Mock.js](https://github.com/nuysoft/Mock) - mockjs 基本语法
## 安装
## 安装使用
```js
// 使git对文件名大小写敏感
git config core.ignorecase false
- 获取项目代码
// 拉取项目代码
```bash
git clone https://github.com/anncwb/vue-vben-admin.git
```
git clone https://github.com/anncwb/vue-vben-admin.git vue-vben-admin-2.0
- 安装依赖
cd vue-vben-admin-2.0
```bash
cd vue-vben-admin
// 如果使用别的包管理工具,可以自行安装
// 如果未安装yarn,请运行:npm install -g yarn
yarn install
```
## 使用
### 开发环境
- 运行
```bash
yarn serve
```
### 打包
- 打包
```bash
yarn build # 打包
yarn build:no-cache # 打包,执行之前会先删除缓存
yarn report # 生成构建包报表预览
yarn build
```
### 格式化
```bash
yarn lint:stylelint # 样式格式化
## 更新日志
yarn lint:prettier # js/ts代码格式化
```
[CHANGELOG](./CHANGELOG.zh_CN.md)
### 其他
## 项目地址
```bash
yarn reinstall # 删除依赖重新装,兼容window
- [vue-vben-admin](https://github.com/anncwb/vue-vben-admin) - 完整版
- [vue-vben-admin-thin-next](https://github.com/anncwb/vben-admin-thin-next) - 简化版
yarn preview # 本地进行打包预览
## 如何贡献
yarn log # 生成CHANGELOG
非常欢迎你的加入![提一个 Issue](https://github.com/anncwb/vue-vben-admin/issues/new/choose) 或者提交一个 Pull Request。
yarn clean:cache # 删除缓存
**Pull Request:**
yarn clean:lib # 删除node_modules,兼容window系统
```
1. Fork 代码!
2. 创建自己的分支: `git checkout -b feat/xxxx`
3. 提交你的修改: `git commit -am 'feat(function): add xxxxx'`
4. 推送您的分支: `git push origin feat/xxxx`
5. 提交`pull request`
## Git 提交规范
## Git 贡献提交规范
- 参考 [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) 规范 ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
......@@ -182,90 +125,45 @@ yarn clean:lib # 删除node_modules,兼容window系统
- `types` 类型定义文件更改
- `wip` 开发中
## 代码贡献
## 相关仓库
1. Fork 代码!
2. 创建自己的分支: `git checkout -b feat/xxxx`
3. 提交你的修改: `git commit -am 'feat(function): add xxxxx'`
4. 推送您的分支: `git push origin feat/xxxx`
5. 提交`pull request`
如果这些插件对你有帮助,可以给一个 star 支持下
## 已完成功能
- [x] 项目搭建(基于 vite)
- [x] 登录和注销
- [x] 菜单(可以搜索及拖拽以及菜单布局)
- [x] 多标签页/面包屑
- [x] 基于角色的权限管理
- [x] 基于后台的权限管理
- [x] 分离的路由和菜单设置
- [x] 可折叠侧边栏
- [x] 可拖拽侧边栏
- [x] 多标签页模式/全局控制
- [x] 菜单搜索
- [x] 页面加载 loading
- [x] 滚动条组件
- [x] 弹窗扩展(可拖拽,全屏,自适应高度)
- [x] 模拟数据
- [x] hook 封装
- [x] 表单组件
- [x] 右键菜单
- [x] 水印插件
- [x] 动画组件
- [x] 二维码插件
- [x] 国际化插件
- [x] 详情组件
- [x] 验证组件
- [x] 树组件
- [x] 图片预览组件
- [x] 表格组件
- [x] 图表库
- [x] 数字动画
- [x] 首屏加载等待动画
- [x] 抽取生产环境配置文件
- [x] 打包 Gzip
- [x] 数据导入导出
- [x] 系统性能优化
- [x] 全局错误处理
- [x] 富文本组件
- [x] 上传组件
- [x] 多语言支持
## 正在开发的功能
- [ ] 主题配置
- [ ] 黑暗主题
- [ ] 打包 CDN
更多组件/功能/建议/bug/欢迎提交 pr 或者 issue
- [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock) - 用于本地及开发环境数据 mock
- [vite-plugin-html](https://github.com/anncwb/vite-plugin-html) - 用于 html 模版转换及压缩
- [vite-plugin-style-import](https://github.com/anncwb/vite-plugin-style-import) - 用于组件库样式按需引入
- [vite-plugin-theme](https://github.com/anncwb/vite-plugin-theme) - 用于打包压缩图片资源
- [vite-plugin-imagemin](https://github.com/anncwb/vite-plugin-imagemin) - 用于在线切换主题色等颜色相关配置
- [vite-plugin-compression](https://github.com/anncwb/vite-plugin-compression) - 用于打包输入.gz|.brotil 文件
## 浏览器支持
本地开发推荐使用`Chrome`浏览器,在火狐浏览器进行开发相对卡顿。
本地开发推荐使用`Chrome 80+` 浏览器
支持现代浏览器, IE 暂不支持,后续考虑支持 ie11
支持现代浏览器, 不支持 IE
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
| :-: | :-: | :-: | :-: | :-: |
| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
更多浏览器可以查看 [Can I Use Es Module](https://caniuse.com/?search=ES%20Module)
## 维护者
## 插件
[@Vben](https://github.com/anncwb)
如果这些插件对你有帮助,可以给一个 star 支持下
## 捐赠
如果你觉得这个项目对你有帮助,你可以帮作者买一杯咖啡表示支持!
- [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock)
- [vite-plugin-html](https://github.com/anncwb/vite-plugin-html)
- [vite-plugin-style-import](https://github.com/anncwb/vite-plugin-style-import)
- [vite-plugin-theme](https://github.com/anncwb/vite-plugin-theme)
- [vite-plugin-imagemin](https://github.com/anncwb/vite-plugin-imagemin)
- [vite-plugin-compression](https://github.com/anncwb/vite-plugin-compression)
![donate](https://anncwb.github.io/anncwb/images/sponsor.png)
## 加入我们
[Paypal Me](https://www.paypal.com/paypalme/cvvben)
`Vue-Vben-Aadmin` 是完全开源免费的项目,在帮助开发者更方便地进行中大型管理系统开发,同时也提供 QQ 交流群(项目刚起步,人数较少,有兴趣的可以加群一起讨论),使用问题欢迎在群内提问。
## 交流
`Vue-vben-Admin` 是完全开源免费的项目,在帮助开发者更方便地进行中大型管理系统开发,同时也提供 QQ 交流群使用问题欢迎在群内提问。
- QQ 群 `569291866`
<img alt="VbenAdmin Logo" width="100" src="./.github/res/imgs/qq.jpeg">
## License
[MIT © Vben-2020](./LICENSE)
import { createProdMockServer } from 'vite-plugin-mock/es/createProdMockServer';
// @ts-ignore
const modules = import.meta.globEager('./**/*.ts');
const mockModules: any[] = [];
......
......@@ -91,8 +91,8 @@
const icons = getIcons();
export default defineComponent({
name: 'IconPicker',
inheritAttrs: false,
components: { [Input.name]: Input, Icon, Popover, ScrollContainer, Pagination, Empty },
inheritAttrs: false,
props: {
value: propTypes.string,
width: propTypes.string.def('100%'),
......
......@@ -26,7 +26,7 @@
import type { PropType } from 'vue';
import { defineComponent, ref } from 'vue';
import { Dropdown, Menu, Checkbox, Input } from 'ant-design-vue';
import { Dropdown, Menu, Input } from 'ant-design-vue';
import { Icon } from '/@/components/Icon';
import { BasicTitle } from '/@/components/Basic';
......@@ -45,7 +45,6 @@
components: {
BasicTitle,
Icon,
Checkbox,
Dropdown,
Menu,
MenuItem: Menu.Item,
......
......@@ -1780,10 +1780,10 @@
dependencies:
vue-demi latest
"@windicss/plugin-utils@0.6.4":
version "0.6.4"
resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-0.6.4.tgz#854f411b156fea61b2e6724799e91f0f9407a637"
integrity sha512-5RZQ71snmoKmZEXHyCByOohUM/SsWIX856+geMwOfbMOGL0guv/1TVg2PalFrZh3k/HfqQnO2ft5YSWKtrW32A==
"@windicss/plugin-utils@0.6.5":
version "0.6.5"
resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-0.6.5.tgz#c37082ea3e52c605508e7fb9b7331cb80b140441"
integrity sha512-8ZZdauxS+d3AE7RQtk7R6cWgiHQ/IUvavv0vsfXHKdvEkwMyI/GUU01VLWTXWRsWyM2+D2F6/HOgUxmxYQx5Sg==
dependencies:
esbuild "^0.8.54"
esbuild-register "^2.0.0"
......@@ -8957,12 +8957,12 @@ vite-plugin-theme@^0.4.8:
es-module-lexer "^0.3.26"
tinycolor2 "^1.4.2"
vite-plugin-windicss@0.6.4:
version "0.6.4"
resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-0.6.4.tgz#2d2bc7831dddff129d597959efaff616c6408a01"
integrity sha512-4BuUglBXeNIrIDfSKyg7rvqKEmxvyja2aKJxgHdOCICV8jIz2MvrZaRS9a74gUihz+OohBYqLnkOlfD+sCIQBg==
vite-plugin-windicss@0.6.5:
version "0.6.5"
resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-0.6.5.tgz#14b6fc43fcbc2dc143b33c83c58e3f7fe820aa9a"
integrity sha512-zEpPlVRaXQbgA0Tsj/N4Kt1jAEZ2aMqVrq4/LaTekS0LCdtD1sQXoadAz2Af/N+qA7ICu8VBpijONH6c8AS4Xg==
dependencies:
"@windicss/plugin-utils" "0.6.4"
"@windicss/plugin-utils" "0.6.5"
windicss "^2.2.3"
vite@^2.0.5:
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册