{"id":13938072,"url":"https://github.com/lss5270/vue-admin-spa","last_synced_at":"2025-07-20T00:31:59.619Z","repository":{"id":53620257,"uuid":"96001745","full_name":"lss5270/vue-admin-spa","owner":"lss5270","description":"基于vue2.0生态的后台管理系统模板（spa）。 a vue management system template based on ：vue2.0 + vue-router + vuex + element-ui +ES6+ webpack + npm。","archived":false,"fork":false,"pushed_at":"2024-03-25T21:11:57.000Z","size":28112,"stargazers_count":837,"open_issues_count":11,"forks_count":229,"subscribers_count":30,"default_branch":"master","last_synced_at":"2024-11-27T06:37:22.519Z","etag":null,"topics":["admin-system","element-ui","javascript","vue","vue-admin","vue-admin-spa","vue-admin-system","webpack"],"latest_commit_sha":null,"homepage":"https://lss5270.github.io/vue-admin-spa-demo","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/lss5270.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-07-02T04:13:27.000Z","updated_at":"2024-11-04T19:44:06.000Z","dependencies_parsed_at":"2024-05-07T20:57:23.844Z","dependency_job_id":"ee661569-5cd6-4fda-91b1-245e68321e8e","html_url":"https://github.com/lss5270/vue-admin-spa","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/lss5270/vue-admin-spa","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lss5270%2Fvue-admin-spa","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lss5270%2Fvue-admin-spa/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lss5270%2Fvue-admin-spa/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lss5270%2Fvue-admin-spa/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lss5270","download_url":"https://codeload.github.com/lss5270/vue-admin-spa/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lss5270%2Fvue-admin-spa/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266048547,"owners_count":23868740,"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":["admin-system","element-ui","javascript","vue","vue-admin","vue-admin-spa","vue-admin-system","webpack"],"created_at":"2024-08-07T23:04:13.018Z","updated_at":"2025-07-20T00:31:54.576Z","avatar_url":"https://github.com/lss5270.png","language":"Vue","funding_links":[],"categories":["Vue"],"sub_categories":[],"readme":"# 后台管理系统 vue-admin-spa（注意：本项目已停更，如有需要可以前往[最新vue3.0版本，功能更多、更全](https://github.com/lss5270/vue-manage-system-plus) ） #\n使用到的技术栈：vue + vue-resource + vue-router + vuex(spa必备) + element-ui + ES6 + webpack + npm \n\n[测试地址](https://lss5270.github.io/vue-admin-spa-demo) （如果无法打开，可尝试将 DNS 修改为 114.114.114.114 即可）\n\n\u003c!-- ## 注意：最近多人多反应项目无法正常运行，是因为升级node到最新版的8.x版本导致的。请换回使用6.0~6.11之间的稳定版即可，node版本可自行下载，也可到我下方的群里下载 ~！ --\u003e\n## 前言\n本项目借鉴vue脚手架和三个项目（取长补短）搭建而成，并且不断完善，目的是为了更接近和适合大家的项目需求，更适合2次开发，以下几点重写过：\n- 登陆注册（含MD5加密）\n- 权限控制，菜单根据用户接口回来的权限数据进行显隐，手敲地址栏，会跳到404（地址栏错误）或401（地址栏正确但无权限），并可以在系统设置中动态修改权限\n- 切换主题，完全支持用户手动切换主题和记住主题\n- 全部数据进行本地json模拟，二次开发者，只需要把json路径替换成实际接口路径即可，即使是新手也能轻松搞定撸后台管理系统\n- 全部动态操作的按钮点击元素，都已经在控制台打印出相关参数，实际开发时把这些参数按需提交给后端接口即可\n\n- 新增了学生模块，使用的是本地真正api接口，\n- 新增了机构管理模块，使用的mockjs接口，附上真正开发的js逻辑（包含校验和提交接口等），实际开发时把真正逻辑代码恢复即可\n\n## 说明\n- 开源目的：提供给基于底层的2次开发者，供更多人学习和参考，少走弯路。\n- 需求定制：这个项目作为底层框架开源，目前只具备了些基本功能，如有其他功能需求可联系群主。\n- 贡献加入：欢迎更多开发者加入这个底层开发，一起贡献和维护，详情联系群主。\n- 及时交流：为了方便大家技术交流,本项目新建了一个qq群--645582193\n\n**有问题可以先提交到issue或者进群讨论\n\n**如果觉得此项目对你有所帮助，记得点击右上方的Star噢 ^_^**\n\n``` **注意：该项目目前使用element-ui@1.3.3+版本,所以最低兼容 Vue 2.3.0**\n```\n\n## 功能(部分数据进行本地json模拟，部分采用mockjs，由于豆瓣api近期封锁故使用豆瓣api部分功能暂时无法预览)\n- 系统说明\n- 登录/注销\n- 密码修改\n- 个人主页\n- 头像上传\n- 权限验证\n- 修改权限\n- 侧边栏\n- 面包屑\n- 富文本编辑器\n- 切换主题（点击头像下拉）\n- 表单校验、提交\n- 列表增删改查、排序、导出(后台管理系统基本功能)\n- 401，404重定向页面\n- 导出excel\n- views-tab\n- PC端更多功能即将开放……\n\n## 开发\n```bash\n    # 克隆代码\n    git clone https://github.com/lss5270/vue-admin-spa.git\n    # 安装依赖\n    npm install\n    #or 直接解压node_modules.7z到当前位置 （比较适合新手）。\n\n    # 本地开发 开启服务\n    npm run dev\n    #or 直接双击start.bat（比较适合新手）\n```\n```[下载node_modules](http://pan.baidu.com/s/1eSL4I8y)\n```\n\n浏览器访问 http://localhost:2018\n\n## 发布\n```bash\n  \n    # 构建生产环境\n    npm run build:prod\n    #or 直接双击build.bat（比较适合新手）\n```\n## 模拟运行正式环境\n```bash\n    # nginx环境下运行\n    1.准备nginx环境，自行到nginx官网（https://nginx.org/）下载，并解压\n    2.双击build.bat后根目录生成一个dist包，把dist整个文件夹拷贝到nginx解压后的html下\n    3.启动nginx服务：双击nginx.exe\n    4.访问入口：http://localhost/dist/index.html\n    ………\n    \n    8.关闭nginx服务：直接删进程\n    \n    # tomcat环境下运行\n    参照nginx步骤即可\n```\n\n## 关于图标\n```\n    本项目使用了两套图标系统，具体使用方法参照以下官方链接:\n    1.http://element.eleme.io/#/zh-CN/component/icon\n    2.http://fontawesome.io/icons/\n    使用方法：\n    a.在index.html中引入\u003clink href=\"//cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css\" rel=\"stylesheet\"\u003e\n    b.在使用图标的地方放置图标\u003ci class=\"fa fa-home\" aria-hidden=\"true\"\u003e\u003c/i\u003e\n```\n## 关于UI系统\n```\n    由于bootstrap不支持mvvm已弃用，本项目使用了全新的elementUI系统，具体使用方法参照以下官方链接:\n    1.http://element.eleme.io/#/zh-CN/component/installation\n    \n```\n## 关于.vue文件中背景图片路径，打包到生产环境路径404的问题修复\n```\n    具体修复方法，参照Issues中的 #6问题\n    \n```\n## 关于学生模块的api接口\n```\n    1.学生模块功能使用了本地api接口，若想正常运行，请下载另外一个node项目（https://github.com/lss5270/vue-admin-spa-api），并且在本地启动该node 项目。\n    2.该node项目源码，相当于其他后端语言（例如java）提供增删查改接口的源代码。\n    3.不懂如何使用node项目的同学，可进群讨论\n    \n```\n\n## 目录结构\n```shell\n├── build                      // 构建相关  \n├── config                     // 配置相关\n├── src                        // 源代码\n│   ├── assets                 // 主题 字体等静态资源\n│   ├── components             // 全局公用组件。不直接显示\n│   ├── global                 // 全局指令\n│   ├── filtres                // 全局filter\n│   ├── router                 // 路由\n│   ├── store                  // 全局store管理\n│   ├── utils                  // 全局公用方法\n│   ├── view                   // view视图层\n│   ├── App.vue                // 入口页面\n│   └── main.js                // 入口 加载组件 初始化等\n├── static                     // 第三方不打包资源\n│   ├── jquery\n│   ├── Tinymce                // 富文本\n│   ├── dataJson               // 模拟接口json\n│   └── theme                  // 主题文件\n├── .babelrc                   // babel-loader 配置\n├── eslintrc.js                // eslint 配置项\n├── .gitignore                 // git 忽略项\n├── favicon.ico                // favicon图标\n├── index.html                 // html模板\n└── package.json               // package.json\n\n```\n\n\n## 状态管理\n目前只有用户信息、菜单权限、app配置相关状态使用vuex存储在全局，其它数据都由每个业务组件自己管理。\n\n\n## License\n\n[MIT](http://opensource.org/licenses/MIT)\n\nCopyright (c) 2017-present, LSS\n\n\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flss5270%2Fvue-admin-spa","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flss5270%2Fvue-admin-spa","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flss5270%2Fvue-admin-spa/lists"}