🚀 LLM 聊天重放
LLM 聊天重放是一个 React 应用，它能对 LLM 聊天记录进行可视化重放，还带有打字动画和播放控制功能。该应用适用于 AI 助手对话（如 Claude），也能处理任何符合指定格式的 Markdown 文件，为用户提供了便捷的聊天记录回顾方式。
✨ 主要特性
- 支持拖放 Markdown 文件上传，操作简单便捷。
- 具备播放控制功能，可随时播放或暂停重放。
- 速度控制灵活，范围从 0.5x 到 4x，满足不同需求。
- 进度条可拖动，能快速跳转到对话的指定部分。
- 聊天窗口自动滚动，且具有智能滚动行为。
- 用户和助手消息采用区分气泡显示，清晰明了。
- 助手回复带有打字动画，增强交互体验。
- 可自动生成并显示对话标题。
💻 使用示例
基础用法
拖放任何符合以下格式的保存的 Markdown 文件：
# 对话标题
**用户**: 您的问题或提示内容
**助手**: 助手的响应内容
🚀 快速开始
先决条件
- Node.js（v16+）
- npm 或 yarn
安装
git clone https://github.com/yourusername/llm-chat-replay.git
cd llm-chat-replay
npm install
npm run dev
使用说明
- 使用
npm run dev启动应用。 - 将保存的 Markdown 文件拖放到界面或点击浏览。
- 使用播放控制重放对话。
- 根据需要调整速度，使用聊天下方的控件。
- 使用进度条跳转到对话的具体部分。
创建兼容的记录文件
与 AI 助手对话时，请按照以下步骤请求完整的转录文件：
让助手保存整个对话的转录文件：
"请将此对话的完整转录保存为 Markdown 文件"
确保保存的 Markdown 文件格式正确，以 "用户:" 和 "助手:" 标记开头。
预提示以确保一致的转录格式
在 AI 助手设置中添加以下预提示，以确保转录格式一致：
当要求编写转录或保存聊天记录时，请按照以下指示操作：
1. 使用 "**用户**:" 和 "**助手**:" 标记开头，与所示格式完全相同
2. 保留所有原始文本格式，但避免可能破坏 Markdown 的特殊字符
3. 对于文件路径或代码：
- 尽量将它们放在单独的行上
- 用反引号 `` 包裹（例如：`这个`）
- 避免在行末使用下划线或其他敏感于 Markdown 的字符
4. 对于函数调用及其结果：
- 格式化为 [函数调用: 相关信息]
- 格式化为 [函数结果: 相关信息]
- 确保它们单独成行
- 如果对话内容较多，可以省略函数结果并用 "..." 替代
5. 保持段落之间的适当间距
6. 使用标准 Markdown 进行任何列表或其他格式化操作
7. 按照以下格式保存文件：chat_YYYYMMDD主题名称.md
请确保转录包含我们的完整对话，保留所有内容，并准备好在聊天重放工具中播放。
示例文件名模式：
- chat_20240219_聊天内容.md
- chat_20240219_this_conversation.md
- chat_20240219_update_config.md
🔧 技术细节
本项目使用了以下技术栈：
- React + Vite：构建用户界面，提供高效的开发和运行环境。
- TypeScript：增强代码的可维护性和类型安全性。
- Tailwind CSS：实现灵活的样式设计。
- Typed.js：用于实现助手回复的打字动画。
📄 许可证
本项目在 MIT 许可证下发布，具体见 LICENSE 文件。
贡献
欢迎贡献！请随时提交 Pull Request。