xingorg1 / vue3-admin

后台管理型项目解决方案，vite创建项目，配合vue3、vuex@next、vue-router@next，使用jsx语法开发，支持多主题在线切换！

vue3-admin

介绍

项目基于 vue@3.x 系列开发（文档：router@4.x、vuex@4.x），UI 组件库使用 ant-design-vue@2.x，开发环境使用 vite@2.x 搭配纯 jsx。

目前支持了登录及主结构，异步菜单，在线切换暗黑、亮白主题及少数 demo 等。

预览

在线预览：（传送门）

登录

1. 暗黑主题

2. 白色主题

工作台

1. 暗黑主题

2. 白色模式

项目结构说明

├── mock                     # 开发模式下的模拟接口，预览模式下使用的fastmock
├── public
│   ├── static               # 静态引用资源
│   └── favicon.ico          # Favicon
├── src
│   ├── apis                 # 接口请求封装方法
│   ├── assets
│   ├── components           # 业务通用组件
│   ├── config               # 项目中的配置
│   ├── layouts              # 通用布局
│   ├── router               # vue路由配置
│   ├── store                # vuex配置
│   ├── styles               # 全局样式
typing # ts 类型申明文件
│   ├── utils                # 工具库
│   └── views                # 业务页面
├── .env                     # 公共的环境常量
├── .env.development         # 开发环境下的环境常量
├── .env.preview             # 预览模式下的环境常量
├── .env.production          # 生产环境下的环境常量
├── .eslintignore            # eslint忽略项配置
├── .gitignore
├── .prettierignore          # prettier忽略项配置
├── index.html               # vite规范的入口文件
├── LICENSE
├── package.json
├── README DEV.md            # 开发文档（待完善）
├── tsconfig.json            # ts config
├── README.md
├── vite.config.ts           # vite配置文件
└── yarn.lock                # 当前版本的lock

注意

1. html 中引用的 less 版本目前仅支持 2.7.3 版本；
2. 目前 build 前需要保证 public/static 下有 color.less 文件（即先运行过 dev，后续将修复）;

...