Request Recorder — Chrome 扩展,录制浏览器 HTTP 请求并支持 8 种格式导出。基于 Plasmo + React + TypeScript + Tailwind CSS 构建。
每次代码改动完成后,必须执行一次构建确认无误:
npm run build构建成功标志:输出 🟢 DONE 且无报错。若构建失败,需修复错误后重新构建,直到通过为止。
- 弹窗与历史页样式统一走 Tailwind class(
src/style.css为共享入口,popup/history 均已引入);新增界面必须同时写浅色与dark:深色两套(darkMode: "media"跟随系统)。 - 页面内悬浮按钮(录制按钮、标注按钮)注入 Shadow DOM,用自包含 CSS,不依赖 Tailwind,深浅色下均需可读。
~/.config/agentsync/docs/CHROME_EXTENSION_DEVELOPMENT_KNOWLEDGE_BASE.md:Chrome 扩展本地开发 / 热更新 / MV3 / 自动化测试 / 商店审核前必读。不读会用脚本或调试协议碰日常 Chrome 配置。docs/REQUEST_RECORDING_KNOWLEDGE_BASE.md:改、评审或排查录制状态、事件配对、body 捕获、SW 生命周期、过滤或会话管理前必读。docs/REQUEST_EXPORT_KNOWLEDGE_BASE.md:改导出格式、Header 分组过滤、复制偏好或高级复制弹窗前必读。docs/PAGE_ANNOTATION_KNOWLEDGE_BASE.md:改标注模式、圈选、线索包、双 world 定位、任务书或站点代码目录映射前必读。不读会破坏标注/任务书契约。docs/OPENDESIGN_RESEARCH.md:规划新手引导、导出预设、会话标记等体验优化前先读;含已验证可借鉴模式。
| 领域 | 入口锚点 |
|---|---|
| 请求录制 | src/background.ts · src/contents/page-patcher.ts · src/contents/injector.ts · src/lib/messages.ts |
| 请求导出 | src/lib/format.ts · src/lib/headerGroups.ts · src/hooks/useCopyPrefs.ts · src/components/history/CopyModal.tsx |
| 页面标注 | src/contents/annotator.tsx · src/contents/annotateContext.ts · src/lib/annotations.ts · src/lib/brief.ts · src/components/annotate/ |