cloud-app-admin☁️

简介

cloud-app-admin 使用了最新的vue3.2+ vite3 Element-Plus TypeScript Tailwind CSS等主流技术开发，希望能和大家一起学习最新前端技术。

在线体验

线上地址： cloud-app-admin (opens new window)

已实现功能

• [x] 路由集成 🧭
• [x] 页面与按钮权限集成 🔒
• [x] 状态管理集成（Pinia）🍍
• [x] Hooks集成（VueUse）🪝
• [x] ElementPlus集成 🖌️
• [x] Tailwind CSS集成 🌹
• [x] Axios二次封装 📦
• [x] i18n国际化集成 🌍
• [x] 代码规范集成（EditorConfig、Eslint、Prettier、Husky、Lint-staged）📒
• [x] Vxe-table多维度图表组件引入 📈
• [x] 封装常用通知、表格Hooks 🎺
• [x] Echarts图表组件库引入 🪐
• [x] 富文本编辑器引入（WangEditor）📝
• [x] Mock引入 🔍
• [x] 支持暗黑模式 🎆
• [x] 支持动态换肤（CSS Variables方案） 🌈
• [x] unplugin-icons引入，配合unplugin-components，无需注册即可按需访问数千个图标作为组件 😊

安装使用

• 获取项目代码

git clone https://github.com/cloudhao1999/cloud-app-admin.git

• 安装依赖

cd cloud-app-admin

pnpm install

• 运行

pnpm dev

Git 贡献提交规范

项目已经内置angular提交规范，通过cz 代替git commit 命令即可

pnpm commit

注意 ⚠️

本项目从V1.7版本开始基于vite3构建，由于vite3不再支持node14.18以下版本，使用较低node版本进行安装或启动本项目可能会出现异常。推荐升级至最新稳定版本node16，或使用V1.6版本，V1.6及以下版本使用vite2构建。

运行截图

• 登陆页

• 首页

• 暗黑模式

• 富文本编辑器

• CRUD列表

• 国际化

• 多级菜单

• 自适应

浏览器支持

本地开发推荐使用Chrome 90+ 浏览器

支持现代浏览器, 不支持 IE

(opens new window)IE	(opens new window)Edge	(opens new window)Firefox	(opens new window)Chrome	(opens new window)Safari
not support	last 2 versions	last 2 versions	last 2 versions	last 2 versions

Q&A

1. 启动项目进入首页出现401报错怎么回事？

   这是由于时间线组件调用了GitHub的API来获取仓库的commit信息，调用API需要申请token，申请token的方法可参考 github的token使用方法 (opens new window)，token获取后可以在src/enum/secretEnum.ts中进行修改，在TimeLine.vue组件中，你可以修改 UserEnum.GITHUB_USER,UserEnum.GITHUB_REPO,SecretEnum.GITHUB_ACCESS_TOKEN枚举字段实现监测自己仓库commit信息功能。

2. 登录界面账号密码是多少？

   随便填，但是账号和密码需要遵循校验规则，账号为手机号或标准邮箱格式，密码不低于三位。