前端企业应用【免费下载链接】Geeker-Admin✨✨✨ Geeker Admin基于 Vue3.4、TypeScript、Vite5、Pinia、Element-Plus 开源的一套后台管理框架。项目地址https://gitcode.com/gh_mirrors/ge/Geeker-Admin点击查看免费下载Geeker-Admin 是一款基于 Vue3.4、TypeScript、Vite5、Pinia、Element-Plus 的开源后台管理框架详见 README.md。本文以仓库根目录的 CHANGELOG.md 为绝对主线逐版本梳理该项目从 0.0.2 到 1.2.0 的完整演进脉络并结合当前仓库源码src/下组件、Hooks、路由、主题等实现进行纵深印证。读完本文你将掌握 Geeker-Admin 各版本的功能边界、核心能力ProTable、动态路由、多布局、暗黑主题、富文本等的引入时间点与底层实现思路也能理解一个中后台框架如何在功能扩展与稳定性之间持续迭代。一、CHANGELOG 概览版本时间线与项目定位CHANGELOG.md 采用standard-version约定式提交规范组织以##记录各发布版本、以### Features与### Bug Fixes分类记录变更。整份文档覆盖了如下关键版本节点版本发布日期阶段定位0.0.22022-06-20框架雏形暗黑模式、图标选择、请求封装、loading 可配置0.0.42022-07-12主题系统与界面配置主题色、灰色/色弱模式、pro-form、菜单搜索0.0.52022-07-21请求示例沉淀loginApi与 useTable 参数修复0.0.62022-08-22大规模功能补全多布局、动态路由、权限、上传、系统管理等0.0.72022-12-28功能收敛与大量 Bug 修复ProTable 重构为属性透传1.0.02023-04-15里程碑树型 ProTable、路由白名单、项目配置重构1.1.02023-07-09工程化升级VitePWA、proTable 增强单选、静态数据、自定义渲染1.2.02023-09-15最新版本插件升级、新增 Tab 功能、整体优化与当前 package.json 中的版本号1.2.0一致说明仓库即处于 CHANGELOG 记录的最终发布状态。整个演进遵循一条清晰路径先搭建核心骨架暗黑模式、请求封装、主题→ 再扩展业务组件与布局ProTable、动态路由、多布局、上传、富文本→ 最后转向工程化与稳定性PWA、规范提交、Bug 收敛。二、0.0.x 时期从框架雏形到功能大爆发2.1 0.0.22022-06-20奠基核心能力0.0.2 是 CHANGELOG 可追溯的最早发布版本其 Features 确立了项目的几个底层方向请求全局 loading 更改为可配置这一设计延续至今。当前 src/api/index.ts 中仍保留请求 loading 的相关处理逻辑配合 src/api/config/servicePort.ts 统一管理服务端口体现了请求层可插拔配置的架构思路。升级 element-plus 到 2.2.5/2.2.6紧跟 Element-Plus 版本迭代为后续二次封装 ProTable 等组件奠定基础。新增暗黑模式这是主题系统的起点。当前实现集中在 src/hooks/useTheme.ts——通过switchDark()在根节点html上切换darkclass并联动重算 Element-Plus 主题色变量--el-color-primary及--el-color-primary-light-1~9同时调用setAsideTheme()、setHeaderTheme()同步侧边栏与头部配色。新增图标选择组件src/components/SelectIcon/index.vue 即为此功能的落地配合element-plus/icons-vue依赖使用。修改 pinia 持久化插件项目集成了pinia-plugin-persistedstate见 package.json持久化逻辑在 src/stores/helper/persist.ts 中统一封装保证刷新后布局、主题等全局状态不丢失。同期 Bug 修复聚焦在 Pro-Table 列设置、useTable钩子的查询参数与默认参数携带问题、loading 请求、登录页默认账号移除等——可见表格场景是早期开发中问题最密集、投入最多的领域。2.2 0.0.42022-07-12主题系统与界面配置成型0.0.4 引入了一直沿用至今的界面配置能力主题色、灰色模式、色弱模式配置useTheme中changePrimary()会根据暗黑与否调用getDarkColor/getLightColorsrc/utils/color.ts动态计算 10 档 Element 主色变量changeGreyOrWeak()则通过在body上设置filter: grayscale(1)或filter: invert(80%)一键切换灰色/色弱模式。新增 pro-form即现在的 src/components/SearchForm/index.vue 前身通过配置项驱动表单渲染为后续 ProTable 的搜索区一体化做铺垫。新增菜单搜索功能对应 src/layouts/components/Header/components/SearchMenu.vue在 0.0.7 中还专门修复了菜单搜索过滤掉isHide为 true 的菜单的问题说明该功能从早期就考虑了隐藏菜单的语义。增加 SearchForm 属性透传采用 Vue 3 的$attrs将原生属性透传至 Element-Plus 组件避免逐属性声明这是项目少封装、多透传组件哲学的最早实践。2.3 0.0.62022-08-22功能大爆发0.0.6 是功能密度最高的一个版本几乎奠定了 Geeker-Admin 的全部核心卖点布局体系新增横向、纵向、经典布局切换并新增分栏布局。当前 src/layouts 目录下的LayoutClassic、LayoutColumns分栏、LayoutTransverse横向、LayoutVertical纵向四个布局目录即与之对应由全局 store 的layout状态驱动切换。路由与权限新增动态路由与路由相关功能同时新增菜单搜索新增按钮、菜单权限示例。动态路由的现代实现见 src/routers/modules/dynamicRouter.ts通过import.meta.glob(/views/**/*.vue)批量加载页面组件先请求菜单与按钮权限列表authStore.getAuthMenuList()/getAuthButtonList()无权限时跳转登录页再将扁平化菜单通过router.addRoute(layout, ...)动态挂载实现路由懒加载 权限拦截 按钮级权限控制的完整链路。按钮权限通过 src/directives/modules/auth.ts 的v-auth指令在视图层消费。组件与页面新增界面配置功能对应 src/layouts/components/ThemeDrawer/index.vue、系统管理模块src/views/system 下的账户、部门、字典、菜单、角色、日志、定时任务等页面、消息通知Header 组件区、页面刷新功能、引导页基于driver.js见 src/views/assembly/guide、图片上传组件src/components/Upload/Img.vue 与 Imgs.vue、wangEditor 富文本二次封装、pro-form、protable 打印与列对齐功能、SVG Icons、treeFilter 组件及标题/data 参数、分类筛选器SelectFilter、请求示例loginApi。工程与状态修改 keepAlive 逻辑支持多级嵌套路由缓存见 src/stores/modules/keepAlive.ts、增加全局错误拦截src/utils/errorHandler.ts、升级 vite/vue 版本并优化分栏布局样式。2.4 0.0.72022-12-28重构与 Bug 收敛0.0.7 标志着项目从功能堆叠转向打磨稳定使用属性透传重构 ProTable 组件这是 ProTable 架构演进的关键一步。透传意味着 ProTable 在保留自身 columns 配置体系的同时可将el-table的原生属性如border、row-key、tree-props等与事件直接穿透大幅降低组件心智负担。请求全局 loading 可配置化与 element-plus、vite、vue 版本升级持续跟随上游技术栈。完善按钮、菜单权限示例对应 src/views/auth 下的 button 与 menu 示例页让权限能力可被直接复现。该版本修复了大量实际使用中暴露的问题涵盖useTable携带默认查询参数、axios 请求超时未拦截、请求 header 参数丢失、路由跳转两次不能携带参数、多图片上传预览初始化异常、横向布局下最大化失效涉及 src/layouts/components/Main/components/Maximize.vue、分栏布局路径匹配、路由重置、弱类型检查错误、el-table 在 Safari 浏览器错乱、ImportExcel 组件、TreeFilter 默认值、useDebounceFn 错误使用、文件导出失败等。这些条目印证了一个规律后台框架的成熟度往往取决于表格、路由、上传这三个高频场景的坑被填了多少。三、1.0.0 里程碑树型表格、路由白名单与配置重构1.0.02023-04-15是首个正式大版本聚焦三类能力升级新增树型 ProTable 示例ProTable 通过透传el-table的tree-props/row-key即可实现树形数据展示仓库中的 src/views/proTable/treeProTable/index.vue 就是该能力的完整示例页。新增路由白名单访问控制配合 src/routers/index.ts 中的路由守卫实现白名单如登录页在未登录状态下可直接访问其余路由统一走权限校验避免未授权页面闪入。优化 ProTable 与面包屑导航、allow nested tree enum data、refactoring project configuration对表格的列配置、面包屑递归匹配逻辑src/layouts/components/Header/components/Breadcrumb.vue以及整个项目配置层进行重构。此外还引入了ProTable 插槽直接暴露 ElTable 的 scope含$index的能力——对应 src/components/ProTable/index.vue 中#tableCell等插槽设计让自定义单元格渲染可以拿到行索引、行数据等上下文。Bug 修复方面重点解决了ProTable 打印功能、多图片上传预览初始化、ImportExcel 组件、分栏布局路径匹配、路由重置等问题并修复了登录后白屏这一致命问题。四、1.1.0工程化升级与 ProTable 能力增强1.1.02023-07-09围绕可观测、可规范、更好用的表格展开新增 proTable 实例类型为ProTableInstance补充 TS 类型声明让组件实例方法如getTableList、reset在 IDE 中具备完整类型提示。优化代码并新增 VitePWA集成vite-plugin-pwa见 vite.config.ts 的插件列表与 package.json devDependencies使项目具备渐进式 Web 应用能力可离线缓存静态资源。proTable radio 选择示例、静态表格数据支持、搜索组件自定义渲染分别对应 src/views/proTable 下的useProTable、complexProTable等示例页——其中支持静态 table data让 ProTable 无需请求接口即可渲染本地数据大大拓宽了使用场景。更新 stylelint 配置、更新主题并修复 bug样式规范与主题系统持续打磨与 .stylelintrc.cjs、postcss.config.cjs 的工程配置呼应。五、1.2.0最新版本的功能收敛1.2.02023-09-15作为当前最新版本与 package.json 中version: 1.2.0一致只保留两条高价值变更升级插件并新增 Tab 功能对应 src/layouts/components/Tabs/index.vue 及其MoreButton子组件——多标签页可关闭、可操作更多成为该版本的核心 UX 增量同时wangeditor、element-plus等依赖均升级到较新版本。更新并优化项目整体内容代码细节、样式与依赖的全面收敛。六、贯穿版本的三大技术主线从 CHANGELOG 反推架构透过 CHANGELOG 的条目可以反推出三条贯穿所有版本的核心技术主线它们也是当前仓库中最值得复用的资产6.1 ProTable配置驱动的高效表格CHANGELOG 中 ProTable 相关条目最多实例类型、静态数据、单选、自定义渲染、打印、列对齐、插槽 scope、列设置、树型表格等说明它是项目的招牌组件。其底层由 src/components/ProTable/index.vue 子组件 ColSetting.vue列设置、Pagination.vue分页、TableColumn.vue动态列渲染构成配合 src/hooks/useTable.ts 统一管理查询参数 / 分页 / 表格数据。useTable 的核心逻辑可见 src/hooks/useTable.ts#L57-L72getTableList()将initParam与分页参数合并进totalParam再与searchInitParam合并后调用 api并通过dataCallBack对返回数据二次加工——这正是 CHANGELOG 中多次修复的查询参数携带问题的最终稳定形态。6.2 主题系统useTheme 多布局 暗黑模式从 0.0.2 的暗黑模式、0.0.4 的主题色/灰色/色弱到 0.0.6 的四布局切换主题系统由 src/hooks/useTheme.ts 统一驱动配合 src/styles/theme 下的 aside、header、menu 三份主题变量表以及 src/stores/modules/global.ts 的持久化状态实现了布局、主题色、暗黑、灰色、色弱的完全可配置。6.3 动态路由与权限白名单 按钮级控制从 0.0.6 的动态路由、0.0.7 的权限示例到 1.0.0 的路由白名单权限体系最终形态为路由守卫判断登录态 → dynamicRouter.ts 拉取菜单/按钮权限并动态addRoute→v-auth指令控制按钮显隐 → 白名单路由免鉴权。这套链路在 src/views/auth 中有完整的可运行示例。七、如何复现与验证安装、运行与规范提交想要在本机验证 CHANGELOG 中描述的各项能力可按照 README.md 的安装步骤操作# 安装依赖 pnpm install # 本地开发 pnpm dev # 或 pnpm serve # 环境构建与 .env 系列文件对应 pnpm build:dev # 开发环境 pnpm build:test # 测试环境 pnpm build:pro # 生产环境 # 代码质量校验 pnpm lint:eslint pnpm lint:prettier pnpm lint:stylelint其中pnpm releasestandard-version正是 CHANGELOG.md 的生成工具pnpm commitczg cz-git则会按约定式提交规范生成符合 CHANGELOG 格式的提交信息详见 commitlint.config.cjs 与 lint-staged.config.cjs。Vite 构建配置代理、gzip/brotli 压缩、资源分类打包等可查阅 vite.config.ts 及 build 目录下的getEnv.ts、proxy.ts、plugins.ts。结语从 CHANGELOG.md 的 200 余行变更记录可以清晰看到Geeker-Admin 的演进遵循骨架 → 血肉 → 打磨 → 工程化的典型中后台框架成长路径早期用暗黑模式、请求封装、主题配置打好地基中期以 ProTable、动态路由、多布局、富文本、上传组件填满业务能力后期则以 PWA、类型增强、规范提交和大量 Bug 修复提升工程品质。对开发者而言这份 CHANGELOG 不仅是一份版本记录更是一份可对照源码逐项学习的功能演进地图——每一个条目都能在当前仓库中找到对应的组件、Hooks 或配置实现。赞分享前端企业应用【免费下载链接】Geeker-Admin✨✨✨ Geeker Admin基于 Vue3.4、TypeScript、Vite5、Pinia、Element-Plus 开源的一套后台管理框架。项目地址https://gitcode.com/gh_mirrors/ge/Geeker-Admin点击查看免费下载相关推荐blur-admin 版本演进全解读从 CHANGELOG.md 看 AngularJS 管理后台框架的架构变迁blur admin 版本演进全解读从 CHANGELOG.md 看 AngularJS 管理后台框架的架构变迁 本篇技术指南以 CHANGELOG.md h前端Tabby IntelliJ 插件版本演进全解析从 CHANGELOG 看 AI 编程助手的迭代路线Tabby IntelliJ 插件版本演进全解析从 CHANGELOG 看 AI 编程助手的迭代路线 导读 本文以仓库中 clients/intellij/人工智能大模型本地部署模型推理服务后端RAG交互助手microsoft/fast-router 演进全解析从 CHANGELOG 看 FAST 路由器的版本迭代与源码级原理microsoft/fast router 演进全解析从 CHANGELOG 看 FAST 路由器的版本迭代与源码级原理 FAST Router 是微软 F前端UI组件上一篇终极指南如何用Majsoul_bot打造你的专属麻将数据分析助手下一篇从TTS静默失败到流畅语音我的Pixelle-Video声音重生记创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考