Awesome

❗ 注意

该项目从 3.1.3 版本之后就用 Vite 进行了重构，并且开源在这里：V3 Admin Vite，如果 Vue CLI 不是你的必选项，那么我建议你使用基于 Vite 的新版本，因为它更快、更强、更规范！

⚡️ 简介

一个免费开源的中后台管理系统基础解决方案，基于 Vue3、TypeScript、Element Plus、 Pinia 和 Vue CLI 5.x

Electron 桌面版: v3-electron

📚 文档

简体中文 | English Docs

国内仓库

Gitee

预览

位置	账号	链接
github-pages	admin 或 editor	链接

⌛ 功能

- 用户管理
  - 登录
  - 注销

- 权限验证
  - 页面权限
  - 指令权限

- 多环境
  - development
  - test
  - production

- 全局功能
  - svg
  - 多主题切换（内置黑暗主题）
  - 动态侧边栏
  - 动态面包屑
  - 标签页快捷导航
  - Screenfull 全屏
  - 自适应收缩侧边栏
  - 前端监控（基于 mitojs）

- 错误页面
  - 401
  - 404

- Dashboard
  - admin
  - editor

- 自动部署

目录结构

# v3-admin
├─ .env.development   # 开发环境
├─ .env.production    # 正式环境
├─ .env.test          # 测试环境
├─ .eslintrc.js       # eslint
├─ deploy             # 自动部署
├─ public
│  ├─ favicon.ico
│  ├─ index.html
├─ src
│  ├─ @types          # ts 声明
│  ├─ api             # api 接口
│  ├─ assets          # 静态资源
│  ├─ components      # 全局组件
│  ├─ config          # 全局配置
│  ├─ constant        # 常量/枚举
│  ├─ directives      # 全局指令
│  ├─ icons           # svg icon
│  ├─ layout          # 布局
│  ├─ model           # 全局 model
│  ├─ plugins         # 插件
│  ├─ router          # 路由
│  ├─ store           # pinia store
│  ├─ styles          # 全局样式
│  ├─ utils           # 全局公共方法
│  └─ views           # 所有页面
│  ├─ App.vue         # 入口页面
│  ├─ main.ts         # 入口文件
│  └─ shims.d.ts      # 模块注入
├─ tsconfig.json      # ts 编译配置
└─ vue.config.js      # vue-cli 配置

🚀 开发

# 配置
1. 安装 eslint 插件
2. 安装 volar 插件
3. node 16+
4. pnpm 6+

# 克隆项目
git clone https://github.com/un-pany/v3-admin.git

# 进入项目目录
cd v3-admin

# 安装依赖
pnpm i

# 启动服务
pnpm dev

📦️ 多环境打包

# 构建测试环境
pnpm build:test

# 构建生产环境
pnpm build:prod

🔧 代码格式检查

pnpm lint

✈️ 自动部署

pnpm deploy

Git 提交规范

feat 增加新功能
fix 修复问题/BUG
style 代码风格相关无影响运行结果的
perf 优化/性能提升
refactor 重构
revert 撤销修改
test 测试相关
docs 文档/注释
chore 依赖更新/脚手架配置修改等
workflow 工作流改进
ci 持续集成
types 类型定义文件更改
wip 开发中
mod 不确定分类的修改

站在巨人的肩膀上

交流群

QQ 群：1014374415（左）&& 加我微信，拉你进微信群（右）

📄 License

MIT