chore: update readme.md

Vben
1 parent 381e3a96
Showing 21 changed files with 282 additions and 474 deletions
.editorconfig
.github/ISSUE_TEMPLATE/1-bug.md
.github/ISSUE_TEMPLATE/2-feature.md
.github/ISSUE_TEMPLATE/3-help.md
.github/ISSUE_TEMPLATE/config.yml
.github/res/imgs/logo.png
.github/res/imgs/preview1.png
.github/res/imgs/preview2.png
.github/res/imgs/preview3.png
.github/res/imgs/qq.jpeg
.github/workflows/deploy.yml
.gitpod.yml
CHANGELOG.en_US.md
CHANGELOG.zh_CN.md
README.md
README.zh-CN.md
mock/_createProductionServer.ts
package.json
src/components/Icon/src/IconPicker.vue
src/components/Tree/src/TreeHeader.vue
@@ -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[] = [];
@@ -110,7 +110,7 @@
     "vite-plugin-pwa": "^0.5.6",
     "vite-plugin-style-import": "^0.7.6",
     "vite-plugin-theme": "^0.4.8",
-    "vite-plugin-windicss": "0.6.4",
+    "vite-plugin-windicss": "0.6.5",
     "vue-eslint-parser": "^7.6.0",
     "yargs": "^16.2.0"
   },
@@ -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: