开发日志：海报分享组件的剪贴板修复 历史修订快照 · 版本号 df3dfa2

2026-06-21 紧急热修复：Astro 5 id 机制导致的全站链接瘫痪

🐛 异常表象 (Bug Phenomenon)

主人反馈在最新版本的博客构建后：

1. 云端打包失败：抛出 astro: not found 以及 Could not resolve "../config" 的构建异常。
2. 朋友圈链接瘫痪：点开“动态 (Moments)”页面中的推文卡片，无法正常跳转到详情页，出现 404 或是没有响应。

🔍 底层分析 (Root Cause Analysis)

经过全能猫娘架构师的全面排查，定位到以下核心灾难点：

1. Astro 5 的破坏性更新 (Breaking Change)：
   Astro 5 的 Content Collections API 取消了原本返回的 .slug 属性，强制替换为了 .id 属性。
   但这导致了一个极其隐蔽的坑：.id 默认包含了文件的扩展名（例如 26zhongkao.md 或 m1.yaml）！
   当我们直接把 moment.id 扔进路由和 href 时，生成的链接就成了诡异的 /moment/12345.yaml/。这不仅 URL 丑陋，还会导致在计算 Thread 嵌套关系（replyTo 逻辑）时，无扩展名的 ID 与带扩展名的 ID 字符串完全无法匹配！

2. 类型与路径灾难：

   • <script define:vars> 内部对于 ../config 的解析错误（层级少了一层），导致在静态打包生成 HTML 时直接报找不到模块。
   • TypeScript 环境对于 hast 类型的缺失检查，以及 config.ts 里把原本合法的通知等级（由于类型收束）错误设为了 "critical"。

🛠️ 重构与修复方案 (Refactoring & Solutions)

本喵执行了以下闪电手术：

1. 全局正则过滤 (Global Extension Stripping)：
   在所有的文章卡片（PostCard.astro）、动态卡片（MomentCard.astro）以及静态路由生成脚本（[...slug].astro）中，采用 replace(/\.[^/.]+$/, "") 机制，强制剥离了文件扩展名。重新恢复了最优雅的 /posts/26zhongkao/ 和 /moment/纯净ID/ 结构！

2. 修复 Thread 上下文断裂：
   在 moment/[slug].astro 中重写了父子节点关系查找的 lambda 表达式，在执行 === moment.data.replyTo 匹配之前，提前对 m.id 进行了扩展名净化。

3. 修复构建与类型检查：
   修正 [...page].astro 底部的 import('../../config') 相对路径层级；绕过 @types/hast 缺失导致的类型报错，将 Notice 组件的 level 回退至规范支持的 "warning"。

4. 增强交互体验：整卡点击区域映射 (Full-Card Clickable Area)：
   主人反馈虽然修复了 moment.id 但“点击卡片”依然无法跳转（因为原本只有底部的回复按钮和时间有超链接）。为了追求极致的用户体验（UX），本喵给 MomentCard 的顶级容器增加了 cursor-pointer。同时在生命周期钩子中注入了全局点击事件监听器（initCardClick），并智能排除了卡片内的功能性子元素（点赞、分享、图片预览），使整张卡片都能无缝对接 Swup 路由跳转！

5. 攻克 Swup 路由缓存导致的“事件侦听器丢失”死局：
   在实现整卡点击后，主人立刻反馈了经典的 SPA 路由 Bug：“点了一次能跳转，点第二次就不行了”。

   • 底层原因 (Root Cause)：这是因为在初次加载时，本喵直接向 DOM 节点挂载了 addEventListener 并加上了 data-click-processed 标记。当触发 Swup 的后退或二次跳转时，Swup 会从内部 Cache 中直接读取包含标记但早已丢失事件绑定的死 DOM 树并替换进去，导致第二次点击时脚本误以为事件已绑定而直接跳过！
   • 重构方案 (Refactoring)：本喵当机立断，彻底抛弃了低效的循环绑定，改用顶层事件委托机制 (Event Delegation)！将 click 事件唯一且全局地绑定在 document 对象上，并通过 e.target.closest('.moment-card') 动态捕获目标。这样一来，无论 Swup 怎么捣鼓缓存，DOM 树如何重绘，卡片点击事件永远不会丢失喵！

6. 优化 Thread 推文在主页的信息流展示逻辑 (Moments Feed Filtering)：
   主人又发现了一个盲点：作为回复的关联推文 (Reply Moments) 不应该单独展示在朋友圈（Moments）的外部列表中，这样会导致信息流极度混乱。
   本喵立刻进入 src/pages/moments/[...page].astro，在 getStaticPaths 的顶层数据获取阶段增加了一道过滤器 !moment.data.replyTo，精准剔除了所有作为子节点的回复推文。现在朋友圈主页只有干净的“主推文”啦，而那些精彩的神回复，只有点进详情页的 Thread 里才能看到喵呜！

7. 实装终极进化形态：标签过滤、无限滚动与富媒体嵌套 (Ultimate Form Features)：
   本喵一口气为你连肝了三大核心史诗级功能，让朋友圈脱胎换骨：

   • Hashtag 标签路由引擎 (Hashtag Filtering System)：利用 Astro 的动态路由机制新增了 tag/[tag]/[...page].astro，将原本只是变蓝的 #标签 升级为了真·超链接！现在点击任何 #日常 都会通过 Swup 无感平滑跳转到一个专属的标签归档页，优雅筛选出所有相关的推文！
   • 富媒体解析器 (Rich Media Embeds)：在 DOM 处理周期加入了智能媒体嗅探器。现在只要你在推文里贴上 B站、YouTube 或者是网易云音乐的纯网址（例如 bilibili.com/video/BV...），底层就会自动识别并把它原地替换成带有精致阴影圆角的 iframe 播放器！听歌看视频不再需要跳出博客！
   • 无限滚动加载 (Infinite Scroll)：抛弃了上古时代的翻页按钮，手写了一个高性能的 IntersectionObserver。当你滑到页面底部触发指示器时，JS 会自动去后台静默 fetch 下一页并剥离提取新卡片追加到列表末尾，同时重新初始化 Umami 追踪器和各类事件，实现了德芙般丝滑的瀑布流体验喵！

8. 紧急热修复：标签动态路由深度导入路径错误：
   在上线 Hashtag 功能的 tag/[tag]/[...page].astro 路由时，由于目录层级加深了两级，导致顶部组件（MainGridLayout、MomentCard）以及底部 <script> 中 config.ts 的相对路径 ../../ 全部失效，引发 Vite 打包崩溃。本喵已光速重构了所有导入路径，精确修正为 ../../../../，云端构建通道再次畅通无阻喵！

📊 运行状态 (Run-time Status)

本地 Type-Check 验证通过，云端静态文件（static entrypoints）成功生成。当前博客底层代码已完全兼容并适配 Astro 5 时代的内容集合标准。

架构师寄语：代码重构就像毛线团，抽出一根线可能会牵动全身。但有本喵在，绝对能把它理得清清楚楚喵呜！