{"id":14977025,"url":"https://github.com/cloudhao1999/cloud-app-admin","last_synced_at":"2025-04-05T18:08:23.288Z","repository":{"id":37357737,"uuid":"493077970","full_name":"cloudhao1999/cloud-app-admin","owner":"cloudhao1999","description":"cloud-app-admin 使用了最新的 Vue3.2 + Vite3 + Element-Plus + TypeScript 等主流技术开发。","archived":false,"fork":false,"pushed_at":"2022-10-11T02:00:28.000Z","size":19122,"stargazers_count":417,"open_issues_count":1,"forks_count":85,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-29T17:09:33.458Z","etag":null,"topics":["element-plus","vitejs","vue3-typescript","vueuse"],"latest_commit_sha":null,"homepage":"","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/cloudhao1999.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-05-17T03:13:54.000Z","updated_at":"2025-03-26T13:49:54.000Z","dependencies_parsed_at":"2022-07-13T18:21:05.990Z","dependency_job_id":null,"html_url":"https://github.com/cloudhao1999/cloud-app-admin","commit_stats":null,"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudhao1999%2Fcloud-app-admin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudhao1999%2Fcloud-app-admin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudhao1999%2Fcloud-app-admin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudhao1999%2Fcloud-app-admin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cloudhao1999","download_url":"https://codeload.github.com/cloudhao1999/cloud-app-admin/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247378144,"owners_count":20929296,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["element-plus","vitejs","vue3-typescript","vueuse"],"created_at":"2024-09-24T13:54:54.104Z","updated_at":"2025-04-05T18:08:23.250Z","avatar_url":"https://github.com/cloudhao1999.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1\u003ecloud-app-admin☁️\u003c/h1\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/vuejs/core\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/vue-3.2.39-brightgreen.svg\" alt=\"vue\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/vitejs/vite\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/vite-3.1.3-brightgreen.svg\" alt=\"vite\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/vuejs/pinia\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/pinia-2.0.22-brightgreen.svg\" alt=\"pinia\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/cloudhao1999/cloud-app-admin/blob/master/LICENSE\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/license/cloudhao1999/cloud-app-admin\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/cloudhao1999/cloud-app-admin/releases\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/v/release/cloudhao1999/cloud-app-admin.svg\" alt=\"GitHub release\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n## 简介\n\ncloud-app-admin 使用了最新的`vue3.2+` `vite3` `Element-Plus` `TypeScript` `Tailwind CSS`等主流技术开发，希望能和大家一起学习最新前端技术。\n\n## 在线体验\n\n线上地址： [cloud-app-admin](https://cloudhao1999.github.io/cloud-app-admin/)\n\n## 项目文档（WIP）\n\n线上地址： [cloud-blog](https://www.cloudhao.top/pages/c125c3/)\n\n## 已实现功能\n\n- [x] 路由集成 🧭\n- [x] 页面与按钮权限集成 🔒\n- [x] 状态管理集成（Pinia）🍍\n- [x] Hooks集成（VueUse）🪝\n- [x] ElementPlus集成 🖌️\n- [x] Tailwind CSS集成 🌹\n- [x] Axios二次封装 📦\n- [x] i18n国际化集成 🌍\n- [x] 代码规范集成（EditorConfig、Eslint、Prettier、Husky、Lint-staged）📒\n- [x] Vxe-table多维度图表组件引入 📈\n- [x] 封装常用通知、表格Hooks 🎺\n- [x] Echarts图表组件库引入 🪐\n- [x] 富文本编辑器引入（WangEditor）📝\n- [x] Mock引入 🔍\n- [x] 支持暗黑模式 🎆\n- [x] 支持动态换肤（CSS Variables方案） 🌈\n- [x] unplugin-icons引入，配合unplugin-components，无需注册即可按需访问数千个图标作为组件 😊\n\n\n## 安装使用\n\n- 获取项目代码\n\n```bash\ngit clone https://github.com/cloudhao1999/cloud-app-admin.git\n```\n\n- 安装依赖\n\n```bash\ncd cloud-app-admin\n\npnpm install\n\n```\n\n\n- 运行\n\n```bash\npnpm dev\n```\n\n## 项目结构\n\n```bash\n├── LICENSE                   授权文件\n├── README.md                 README\n├── dist                      编译目录\n│   ├── assets\n│   ├── favicon.ico\n│   ├── images\n│   └── index.html\n├── index.html                HTML模板\n├── locales                   I18n文件\n│   ├── en.json\n│   └── zh-CN.json\n├── mock                      模拟数据文件\n│   ├── article.ts\n│   ├── route.ts\n│   ├── upload.ts\n│   └── user.ts\n├── package.json\n├── pnpm-lock.yaml\n├── postcss.config.js\n├── public                    网站公共目录 \n│   ├── favicon.ico           网站图标 \n│   └── images                资源文件\n├── screenshot                截图\n│   ├── crud.png\n│   ├── dashboard-dark.png\n│   ├── dashboard-light.png\n│   ├── editor.png\n│   ├── i18n.png\n│   ├── login.png\n│   ├── mobile.png\n│   └── nested.png\n├── src  源码目录\n│   ├── App.vue               页面入口\n│   ├── api                   接口文件\n│   ├── assets                静态资源\n│   ├── components            公共组件\n│   ├── directives            指令库\n│   ├── enum                  全局枚举文件\n│   ├── env.d.ts\n│   ├── hooks                 自定义hooks\n│   ├── layouts               项目布局文件\n│   ├── main.ts               程序入口\n│   ├── model                 模型定义类型文件\n│   ├── plugins               插件文件\n│   ├── router                路由文件\n│   ├── store                 全局状态\n│   ├── style                 全局样式\n│   ├── utils                 工具库\n│   └── views                 视图\n├── stats.html\n├── tailwind.config.js\n├── tsconfig.json\n├── tsconfig.node.json\n├── types                     ts类型定义\n│   ├── auto-imports.d.ts\n│   ├── components.d.ts\n│   ├── http.d.ts\n│   ├── menu.d.ts\n│   ├── resultType.d.ts\n│   ├── router.d.ts\n│   ├── table.d.ts\n│   └── viteEnv.d.ts\n├── vite\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n│   ├── alias.ts              vite别名配置\n│   ├── plugins               vite插件模块\n│   └── util.ts               vite工具库\n└── vite.config.ts            vite配置文件\n```\n\n## Git 贡献提交规范\n\n项目已经内置angular提交规范，通过cz 代替git commit 命令即可\n\n```bash\npnpm commit\n```\n\n## 注意 ⚠️\n\u003e 本项目从V1.7版本开始基于vite3构建，由于vite3不再支持node14.18以下版本，使用较低node版本进行安装或启动本项目可能会出现异常。推荐升级至最新稳定版本node16，或使用V1.6版本，V1.6及以下版本使用vite2构建。\n\n## 运行截图\n\n- 登陆页\n\n![login](./screenshot/login.png)\n\n- 首页\n\n![dashboard-light](./screenshot/dashboard-light.png)\n\n- 暗黑模式\n\n![dashboard-dark](./screenshot/dashboard-dark.png)\n\n- 富文本编辑器\n\n![editor](./screenshot/editor.png)\n\n- CRUD列表\n\n![crud](./screenshot/crud.png)\n\n- 国际化\n\n![i18n](./screenshot/i18n.png)\n\n- 多级菜单\n\n![nested](./screenshot/nested.png)\n\n- 自适应\n\n![mobile](./screenshot/mobile.png)\n\n## 浏览器支持\n\n本地开发推荐使用`Chrome 90+` 浏览器\n\n支持现代浏览器, 不支持 IE\n\n| [\u003cimg src=\"https://raw.githubusercontent.com/alrra/browser-logos/master/src/archive/internet-explorer_9-11/internet-explorer_9-11_48x48.png\" alt=\"IE\" width=\"24px\" height=\"24px\"  /\u003e](http://godban.github.io/browsers-support-badges/)IE | [\u003cimg src=\"https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png\" alt=\" Edge\" width=\"24px\" height=\"24px\" /\u003e](http://godban.github.io/browsers-support-badges/)Edge | [\u003cimg src=\"https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png\" alt=\"Firefox\" width=\"24px\" height=\"24px\" /\u003e](http://godban.github.io/browsers-support-badges/)Firefox | [\u003cimg src=\"https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png\" alt=\"Chrome\" width=\"24px\" height=\"24px\" /\u003e](http://godban.github.io/browsers-support-badges/)Chrome | [\u003cimg src=\"https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png\" alt=\"Safari\" width=\"24px\" height=\"24px\" /\u003e](http://godban.github.io/browsers-support-badges/)Safari |\n| :----------------------------------------------------------: | :----------------------------------------------------------: | :----------------------------------------------------------: | :----------------------------------------------------------: | :----------------------------------------------------------: |\n|                         not support                          |                       last 2 versions                        |                       last 2 versions                        |                       last 2 versions                        |                       last 2 versions                        |\n\n## Q\u0026A\n\n1. 启动项目进入首页出现401报错怎么回事？\n\n   这是由于时间线组件调用了GitHub的API来获取仓库的commit信息，调用API需要申请token，申请token的方法可参考 [github的token使用方法](https://blog.csdn.net/chengwenyang/article/details/120060010)，token获取后可以在`src/enum/secretEnum.ts`中进行修改，在`TimeLine.vue`组件中，你可以修改 `UserEnum.GITHUB_USER`,`UserEnum.GITHUB_REPO`,` SecretEnum.GITHUB_ACCESS_TOKEN`枚举字段实现监测自己仓库commit信息功能。\n\n2. 登录界面账号密码是多少？\n\n   随便填，但是账号和密码需要遵循校验规则，账号为手机号或标准邮箱格式，密码不低于三位。\n\n   \n\n   \n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcloudhao1999%2Fcloud-app-admin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcloudhao1999%2Fcloud-app-admin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcloudhao1999%2Fcloud-app-admin/lists"}