Files
hunli/.workbuddy/memory/2026-07-30.md
2026-07-30 17:57:41 +08:00

4.4 KiB
Raw Blame History

2026-07-30 婚礼纪 vite-tailwindcss 优化

完成内容

  • 后台编辑(新增):新增登录页 src/views/admin/AdminLogin.vue、结构化编辑后台 src/views/admin/AdminEditor.vue(基础信息/文案/视觉动效/相册页CRUD/婚礼流程CRUD/出席回执列表),src/stores/admin.js 管理 tokensrc/components/ImageField.vue 图片上传组件。路由 /login/admin(requiresAuth)。
  • 动效(完善):新增 src/styles/animations.css(帘幕/淡入/花瓣/爱心/心跳/流光等)、src/directives/reveal.jsv-reveal 滚动入场指令,支持 up/down/left/right/scale/blur + delaysrc/composables/useAudio.js(背景音乐,处理自动播放限制)。
  • 请柬页重构 src/views/index/index.vue:入场揭幕、真实音乐、视差封面、花瓣+爱心粒子层(配置驱动)、整页吸附/自由滚动(配置驱动)+ 进度条、逐段 v-reveal、去除旧内联编辑改为纯访客页
  • 统一 API src/api/wedding.jsaxios 走 /api 代理,处理 code===200 约定;替代旧 index.vue 里硬编码 localhost:8080 的 fetch。
  • Go 后端 hunliji-api/main.go:新增 /api/admin/loginHMAC 令牌,纯标准库),POST /api/config 加 Bearer 鉴权,GET /api/rsvp/list 受保护。
  • 配置 schema 新增:scrollMode(snap|free)、musicUrlpetalEnabledbubbleEnabledintroEnabled

关键坑/约定(跨会话有用)

  • 架构坑:真实请柬 UI 原本写在 src/App.vue(根组件,且无 <router-view>src/views/index/index.vue 只是占位。已将 App.vue 改为 <router-view/> 根出口,首页=index.vue/admin、/login 才真正生效。
  • vite 代理vite.config.js 代理目标改为 http://127.0.0.1:8080Go 后端端口),不再重写 /api
  • 后台默认账号admin / admin123可用环境变量 ADMIN_ACCOUNT/ADMIN_PASSWORD/ADMIN_SECRET 覆盖)。
  • 本机 build 怪象:环境 safe-delete 回收站不可用,vite build 清空 dist 会失败;验证用 npx vite build --outDir dist-verify,完后 rm -rf dist-verifyrm 也走 safe-delete少量文件可删
  • Go 构建在本沙箱因 AppData 缓存/telemetry 写权限被拒,需 export GOCACHE=Windows绝对路径GOTELEMETRY=off;代码本身可编译(仅标准库新增)。

验证

  • 前端 npx vite build 通过BUILD_EXIT=0AdminLogin/AdminEditor/index 三个 chunk 均产出)。
  • 后端未在此环境实跑(需 MySQL nl_wedding 库)。

2026-07-30 下午:修复 "/admin 进不去后台"(重要根因)

  • 现象:浏览器访问 /admin 进不去。排查发现 8888 上跑的开发服务器返回的是默认 Vite + Vue 模板旧代码App.vue 无 router-view即旧服务没加载新代码且项目 node_modulespnpm 风格软链接布局node_modules/vite.pnpm/...Node ESM 在本沙箱里无法跟随该软链接解析包,导致 vite 起不来或 config 加载报 ERR_MODULE_NOT_FOUND
  • 修复:把损坏的 node_modules 改名移走(mv node_modules node_modules_bak),删掉 pnpm-lock.yaml,用 npm install 重新装出扁平(非软链接)依赖node_modules/vite 变真实目录ESM 解析恢复正常,npm run dev / 直接 node node_modules/vite/bin/vite.js 均正常。
  • 最终验证(无头浏览器实跑):启动 vite端口 8888/admin → 正确 302 到 /login?redirect=/admin;用 admin/admin123 登录 → 进入后台编辑器,六标签页(基础信息/邀请文案/视觉与动效/相册页管理/婚礼流程/出席回执)完整渲染,且已从 Go 后端加载到配置数据(新郎李琦、新娘李逸烁等)。截图存于 D:/myCode/hunliji/dev/_shots/login.pngadmin-editor.png
  • 环境安全删除彻底坏了bash rm -rf 与 PowerShell Remove-Item -Recurse -Force 都被 safe-delete 包装拦截,报 "这个系统不支持该功能" 而失败关闭。因此 .npmcache、改名后的 _old_node_modules_bak(在仓库外 D:/myCode/hunliji/_old_node_modules_bak无法用工具删除,只能用户手动删。这也解释了之前 vite build 清 dist 失败是同一根因。
  • 教训:本工程若出现 "vite 起不来 / config 加载失败 / 路由 404",优先怀疑 node_modules 的软链接布局是否损坏,重装为扁平依赖即可。