kits.chat 迭代版本文档：v12.0.9

• 发布日期：2026-04-24
• 范围：kits-chat（工具组件）+ kits-web（工具页加载）

变更日志

功能新增

- 支持头像上传（双方） - 支持随机生成聊天模板（不复用真实截图内容） - 支持导出 PNG 截图（2x 清晰度） - 支持“逐条出现”的播放动画（含模拟音效开关） - 支持导出 WebM 动画（浏览器兼容情况下）

• 新增工具：微信聊天截图生成器

工程改动

• kits-chat 新增依赖 html2canvas，用于 DOM 截图导出
• kits-web 开发脚本固定使用 webpack dev（避免 Turbopack 与自定义 webpack 配置冲突）

AI 动作全过程（可审计摘要）

- 新增工具组件与工具元信息注册 - 接入 ToolModal switch，并生成 Next 侧 toolLoaders - 补齐导出 PNG + 播放动画 + 导出 WebM（含模拟音效） - 修复文件输入事件在部分浏览器下的兼容问题 - 本地构建验证：kits-chat / kits-web 均通过

• 接受指令：实现微信聊天截图生成器，并打通开发/测试/发布/部署/验收流程
• 评估：复用现有工具体系（toolId → 组件）接入 Next 工具页；截图导出用 html2canvas
• 执行修改（摘要）：

完成效率

• 开发/测试用时：N/A（当前环境无统一计时器；可按终端命令日志复核）
• Token 消耗：N/A（当前会话未暴露可校验的 token 统计来源）

构建与验收（不含敏感信息）

本地构建

cd kits-chat
npm install
npm run build

cd ../kits-web
npm install
node ../scripts/gen-next-tool-loaders.mjs
npm run build

本地验收要点

• 打开 `/wechat-chat-generator`
• 点击“随机生成”，确认内容为随机模板
• 上传双方头像，预览与导出 PNG 中头像一致
• 点击“播放动画”，确认消息逐条出现并可切换音效
• 点击“导出 WebM”，浏览器支持时导出成功（不支持时按钮无效或无下载）