页签名称	适用模式	描述
任务摘要	Work Design	展示与当前任务相关的详情，包括：待办：当任务较复杂时，AI 会在此处列出任务计划（Todos）。你可以实时追踪每个子任务的进度。任务产物：用于存放 AI 为该任务生成的文件。参考信息：实时显示 AI 执行任务时引用的所有上下文，包括技能、文件、联网搜索内容等。
任务摘要	Code	展示与当前任务相关的详情，包括：待办：当任务较复杂时，AI 会在此处列出任务计划（Todos）。你可以实时追踪每个子任务的进度。上下文：实时显示 AI 执行任务时引用的所有上下文，包括技能、文件、联网搜索内容等。若该任务所使用的上下文超出预期，你可以点击压缩按钮来压缩上下文。
浏览器	Work Code Design	在浏览器中预览 AI 生成的产物，验证视觉效果和交互逻辑。你也可以在浏览器中打开其他网页进行浏览。
终端	Code	运行终端命令，协助完成开发、调试等操作。
画布	Design	任务完成后，系统会在画布中展示设计成果。你可以在画布中预览、移动和整理产物，导入素材，或导出设计文件等。

预览与编辑产物

对于 Web 应用，TraeWork 完成开发后，系统会在工具面板中打开产物预览页签。你可以在该页签中预览产物，并对页面元素进行修改。

点击右上角的 选择元素 按钮。
选择需要修改的元素。
选择合适的修改方式，并完成相应操作：
- 直接修改：在预览页签右侧的 “设计” 或 “CSS” 面板中，直接修改目标属性。
- 评论到对话：点击 评论到对话 按钮，在显示的输入框中填写修改意见，并将该元素连同修改意见发送给 AI 处理。
- 添加到对话：点击 添加到对话 按钮，将该元素添加至对话框，再输入修改意见并发送给 AI 处理。

关于如何编辑 HTML 产物。参考 HTML 产物管理。

管理任务

你可以对任务进行置顶、重命名、删除等操作。

通过以下任一方式打开任务的操作菜单：
- 在左侧任务栏中，将鼠标悬浮至目标任务，然后点击任务条目右侧的 更多操作 图标。
- 在对话面板顶部，点击任务名称右侧的 更多操作 图标。
从菜单中选择所需操作，包括：
- 置顶或取消置顶任务；
- 查看任务相关的文件（列表视图或树状视图），以及在任务中新建文件或文件夹；
- 重命名任务；
- 删除任务。

你可以通过关键词进行跨模式全局搜索，快速查找目标任务或任务中的 Query。

当你使用同一账号登录 TraeWork 桌面版和网页版后，在任一客户端内 “云端” 模式下发起的任务会自动同步至另一个客户端，并实时更新执行进度，且支持在任意一端管理任务。

当你熟悉了基本操作后，可以通过以下方式进一步增强你在 TraeWork 中的办公、开发或设计体验。

你可以将外部第三方应用集成（例如 GitHub）至 TraeWork，从而拓展 TraeWork 的能力边界，让 AI 助力你实现更多操作的自动化，例如由 AI 自动创建 PR 等。目前，TraeWork 支持集成 GitHub 和飞书。

详情参考：GitHub、飞书

你可以在云端创建并维护以下上下文内容：

MCP：通过模型上下文协议（Model Context Protocol，MCP），将外部工具和服务连接至 TraeWork，让 AI 具备调用外部服务的能力。
详情参考：MCP 概述
技能：为 AI 提供“专业能力说明书”，使其在执行特定领域的任务时表现更出色。
详情参考：技能
斜杠命令：创建你自己的快捷指令，用于在对话中快速执行重复性任务。
详情参考：命令
规则：制定代码风格、语言框架等规范，让 AI 的输出始终符合你的个人偏好。
详情参考：规则

文档对您有帮助吗?