初始化

This commit is contained in:
李琦
2026-07-30 17:57:41 +08:00
commit 88d5ca03b6
18 changed files with 498 additions and 0 deletions

View File

@@ -0,0 +1,27 @@
# 2026-07-30 婚礼纪 vite-tailwindcss 优化
## 完成内容
- **后台编辑(新增)**:新增登录页 `src/views/admin/AdminLogin.vue`、结构化编辑后台 `src/views/admin/AdminEditor.vue`(基础信息/文案/视觉动效/相册页CRUD/婚礼流程CRUD/出席回执列表),`src/stores/admin.js` 管理 token`src/components/ImageField.vue` 图片上传组件。路由 `/login``/admin`(requiresAuth)。
- **动效(完善)**:新增 `src/styles/animations.css`(帘幕/淡入/花瓣/爱心/心跳/流光等)、`src/directives/reveal.js``v-reveal` 滚动入场指令,支持 up/down/left/right/scale/blur + delay`src/composables/useAudio.js`(背景音乐,处理自动播放限制)。
- **请柬页重构** `src/views/index/index.vue`:入场揭幕、真实音乐、视差封面、花瓣+爱心粒子层(配置驱动)、整页吸附/自由滚动(配置驱动)+ 进度条、逐段 v-reveal、去除旧内联编辑改为纯访客页
- **统一 API** `src/api/wedding.js`axios 走 `/api` 代理,处理 `code===200` 约定;替代旧 `index.vue` 里硬编码 localhost:8080 的 fetch。
- **Go 后端** `hunliji-api/main.go`:新增 `/api/admin/login`HMAC 令牌,纯标准库),`POST /api/config` 加 Bearer 鉴权,`GET /api/rsvp/list` 受保护。
- 配置 schema 新增:`scrollMode`(snap|free)、`musicUrl``petalEnabled``bubbleEnabled``introEnabled`
## 关键坑/约定(跨会话有用)
- **架构坑**:真实请柬 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:8080`Go 后端端口),不再重写 `/api`
- **后台默认账号**admin / admin123可用环境变量 ADMIN_ACCOUNT/ADMIN_PASSWORD/ADMIN_SECRET 覆盖)。
- **本机 build 怪象**:环境 safe-delete 回收站不可用,`vite build` 清空 dist 会失败;验证用 `npx vite build --outDir dist-verify`,完后 `rm -rf dist-verify`rm 也走 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_modules`**pnpm 风格软链接布局**`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.png``admin-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 的软链接布局是否损坏,重装为扁平依赖即可。