{"id":13821393,"url":"https://github.com/qingqingxuan/vue-admin-work-x","last_synced_at":"2025-05-16T12:33:21.718Z","repository":{"id":37746983,"uuid":"422812655","full_name":"qingqingxuan/vue-admin-work-x","owner":"qingqingxuan","description":"🎉🎉🎉Vue Admin Work X，漂亮、强大、完善。采用 Vue3 Webpack Typescript Element Plus编写的中后台框架。全面的系统配置，优质模板，常用组件，真正一站式开箱即用🎉🎉🎉","archived":false,"fork":false,"pushed_at":"2022-10-21T04:14:44.000Z","size":18359,"stargazers_count":215,"open_issues_count":2,"forks_count":46,"subscribers_count":6,"default_branch":"master","last_synced_at":"2024-11-19T21:36:04.549Z","etag":null,"topics":["element-ui","elementplus","pinia","typescript","vue","vue3","webpack"],"latest_commit_sha":null,"homepage":"http://x.vueadminwork.com","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/qingqingxuan.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","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":"2021-10-30T07:20:52.000Z","updated_at":"2024-11-05T13:40:00.000Z","dependencies_parsed_at":"2022-07-12T16:44:44.265Z","dependency_job_id":null,"html_url":"https://github.com/qingqingxuan/vue-admin-work-x","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qingqingxuan%2Fvue-admin-work-x","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qingqingxuan%2Fvue-admin-work-x/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qingqingxuan%2Fvue-admin-work-x/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qingqingxuan%2Fvue-admin-work-x/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/qingqingxuan","download_url":"https://codeload.github.com/qingqingxuan/vue-admin-work-x/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254530650,"owners_count":22086653,"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-ui","elementplus","pinia","typescript","vue","vue3","webpack"],"created_at":"2024-08-04T08:01:21.165Z","updated_at":"2025-05-16T12:33:18.538Z","avatar_url":"https://github.com/qingqingxuan.png","language":"Vue","funding_links":[],"categories":["Vue"],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\u003cimg src=\"http://qingqingxuan.gitee.io/img/logo.png\" align=\"center\" width=\"150\" height=\"150\"/\u003e\n\u003c/div\u003e\n\n\u003cp align=\"center\"\u003e\n    \u003ca href=\"./LICENSE\"\u003e\n        \u003cimg src=\"https://img.shields.io/github/license/qingqingxuan/admin-work\" alt=\"MIT License\" /\u003e\n    \u003c/a\u003e\n    \u003ca href=\"https://v3.cn.vuejs.org/\"\u003e\n        \u003cimg src=\"https://img.shields.io/badge/vue.js-3.0-green\" alt=\"Vue3.0\"\u003e\n    \u003c/a\u003e\n    \u003ca href=\"http://p.vueadminwork.com\"\u003e\n        \u003cimg src=\"https://img.shields.io/badge/🚀-open--in--browser-blueviolet\" alt=\"Live Demo\"\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\u003ch1 align = \"center\"\u003eAdmin Work X\u003c/h1\u003e\n\n## 简介：\n\nAdmin Work X，是 Vue Admini Work 系列中最成熟和完善的中后台框架，全面的系统配置，优质模板，常用组件，真正一站式开箱即用 采用时下最流行的 Vue3 UI 库--NaiveUI\n\n使用了当今最流行的技术框架： `Vue3 + Webpack + Typescript + Element Plus`\n\n## 特性：\n\n- 常用模板\n  - 内置常用模板，无需考虑交互排版，助你高效开发\n- 预设样式\n  - 样式美观大方，无缝对接 Naive Ui，随意组合页面，随心所欲\n- 布局方案\n  - 丰富的布局模式，具有高可配性，满足您的各类布局需求\n- 技术支持\n  - 优质的售后技术支持，完善的文档，让您事半功倍\n- 最新技术栈\n  - 基于 Vue3、Vite2、TypeScript、NaiveUI、Pinia 等最新技术栈开发\n- 轻量快速的热重载\n  - 无论应用程序大小如何，都始终极快的模块热重载（HMR）\n- 丰富的示例\n  - 常见的 Web 端插件示例实现\n- 组件封装\n  - 对日常使用频率较高的组件二次封装,满足基础工作需求\n- 主题配置\n  - 丰富的主题配置及黑暗主题适配\n- 权限管理\n  - 完善的前后端权限管理方案\n\n## 项目地址：\n\n- [🎉 文档地址](http://www.vueadminwork.com)\n\n- [🎉 演示地址（Vue3.x + Typescript + Webpack+ ElementPlus)](http://x.vueadminwork.com)\n\n## Vue Admin Work 系列中其它开源项目的演示地址\n\n- [🎉 Vue Admin Work 演示地址（Vue2.x + Javascript + Element UI + Webpack）](http://x.vueadminwork.com)\n\n- [🎉 Vue Admin Work X 演示地址（Vue3.x + Typescript + Element Plus + Webpack）](http://x.vueadminwork.com)\n\n- [🎉 Vue Admin Work P 演示地址（Vue3.x + Typescript + Navie UI + Vite2)](http://p.vueadminwork.com)\n\n- [🎉 Vue Admin Work A 演示地址（Vue3.x + Typescript + Antd + Vite2)](http://a.vueadminwork.com)\n\n- [🎉 Arco Work 演示地址（Vue3.x + Typescript + Arco Design + Vite2)](http://arco.vueadminwork.com)\n\n## 现在微信技术交流群需要添加好友之后邀请，如需要入群讨论请关注微信公众号添加好友。\n\n\u003cdiv  align=\"center\"\u003e\n\u003cimg width=\"30%\" src=\"http://www.vueadminwork.com/weixin-custom.jpg\"/\u003e\n\u003c/div\u003e\n\n## 请关注我们的微信公众号 `知码前端` ，里面包含了各个版本的源码和进入微信福利群的方式\n\n\u003cdiv  align=\"center\"\u003e\n\u003cimg width=\"30%\" src=\"http://qingqingxuan.gitee.io/img/wx-service.jpg\"/\u003e\n\u003c/div\u003e\n\n## 适合人群\n\n- 正在以及想使用 vue/element-plus 开发，最好是有一定的编程知识，或者原来只从事切图写静态页的人想提高自己的前端能力。\n- 熟悉 Vue.js 技术栈，使用它开发过几个实际项目。\n- 对原理技术感兴趣，想进阶和提升的同学。\n\n## 下载\u0026安装\n\n- 下载\n\n  ```bash\n  git clone -b master https://github.com/qingqingxuan/vue-admin-work-x.git\n  ```\n\n- 进入项目目录\n  ```bash\n  cd admin-work-x\n  ```\n- 安装依赖\n\n  ```bash\n  npm install\n  ```\n\n- 运行\n  ```bash\n  npm run dev\n  ```\n\n## 如何贡献\n\n非常欢迎你的加入！[提一个 Issue](https://github.com/qingqingxuan/admin-work/issues/new) 或者提交一个 Pull Request。\n\n**Pull Request:**\n\n1. Fork 代码!\n2. 创建自己的分支: `git checkout -b feat/xxxx`\n3. 提交你的修改: `git commit -am 'feat(function): add xxxxx'`\n4. 推送您的分支: `git push origin feat/xxxx`\n5. 提交`pull request`\n\n## Git 贡献提交规范\n\n- 参考 [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))\n\n  - `feat` 增加新功能\n  - `fix` 修复问题/BUG\n  - `style` 代码风格相关无影响运行结果的\n  - `perf` 优化/性能提升\n  - `refactor` 重构\n  - `revert` 撤销修改\n  - `test` 测试相关\n  - `docs` 文档/注释\n  - `chore` 依赖更新/脚手架配置修改等\n  - `workflow` 工作流改进\n  - `ci` 持续集成\n  - `types` 类型定义文件更改\n  - `wip` 开发中\n\n## 浏览器支持\n\n本地开发推荐使用`Chrome 80+` 浏览器\n\n支持现代浏览器, 不支持 IE\n\n| [\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/)\u003c/br\u003eIE | [\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/)\u003c/br\u003eEdge | [\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/)\u003c/br\u003eFirefox | [\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/)\u003c/br\u003eChrome | [\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/)\u003c/br\u003eSafari |\n| :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: |\n|                                                                                             not support                                                                                              |                                                                                            last 2 versions                                                                                             |                                                                                                  last 2 versions                                                                                                  |                                                                                                last 2 versions                                                                                                |                                                                                                last 2 versions                                                                                                |\n\n## 特别感谢\n\n| **[🚀 vue3.x](https://cn.vuejs.org/)**                     |\n| --------------------------------------------------------- |\n| **[🚀 element-plus](https://element-plus.org)**            |\n| **[🚀 vue-router-next](https://next.router.vuejs.org/)**   |\n| **[🚀 pinia](https://pinia.vuejs.org/)**                   |\n| **[🚀 axios](http://www.axios-js.com/)**                   |\n| **[🚀 mockjs](http://mockjs.com/)**                        |\n| **[🚀 echarts](https://echarts.apache.org/zh/index.html)** |\n\n## 优势及注意事项\n\n```tex\nvue-admin-work 有如下优势:\n1. 支持前端控制路由权限和后端控制路由模式\n2. 支持 mock ，完全独立于后台\n3. 提供了非常多的 mxin 代码块，方便集成各种功能\n4. 内置了大量常用的组件，比如，上传，消息提示等\n5. 支持多主题、多布局切换\n使用注意事项:\n1. 项目默认使用使用vscode工具进行开发，也是唯一推荐的开发工具\n2. 项目默认eslint校验规范\n```\n\n## 效果图\n\n| \u003cimg src=\"http://qingqingxuan.gitee.io/img/demo-arco-1.png\" style=\"zoom:20%;\" /\u003e | \u003cimg src=\"http://qingqingxuan.gitee.io/img/demo-arco-2.png\" style=\"zoom:20%;\" /\u003e |\n| :------------------------------------------------------------------------------: | -------------------------------------------------------------------------------- |\n| \u003cimg src=\"http://qingqingxuan.gitee.io/img/demo-arco-3.png\" style=\"zoom:20%;\" /\u003e | \u003cimg src=\"http://qingqingxuan.gitee.io/img/demo-arco-4.png\" style=\"zoom:20%;\" /\u003e |\n| \u003cimg src=\"http://qingqingxuan.gitee.io/img/demo-arco-5.png\" style=\"zoom:20%;\" /\u003e | \u003cimg src=\"http://qingqingxuan.gitee.io/img/demo-arco-6.png\" style=\"zoom:20%;\" /\u003e |\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fqingqingxuan%2Fvue-admin-work-x","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fqingqingxuan%2Fvue-admin-work-x","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fqingqingxuan%2Fvue-admin-work-x/lists"}