AI 编程环境

①

AI 对话区

简称对话区，是开发者和扣子 AI 的对话窗口，开发者可通过自然语言下达 AI 编程的指令，控制 AI 生成代码、修改代码。
该区域还支持精准关联上下文、提供多样化的交互形式，详细说明可参考对话区。

②

文件树

文件树用于可视化展示项目目录结构，开发者可通过文件树查看扣子编程生成的代码文件。在扣子 AI 编程环境右上角单击文件夹图标，即可打开文件树区域。
详细说明可参考文件树。

③

工作区

工作区是扣子 AI 编程环境的主面板，它集成了代码编辑、运行调试等多种功能，开发者可在此对扣子 AI 生成的代码进行编辑和测试。

• 代码编辑：在文件树中单击指定代码文件，即可在工作区查看并编辑此文件。详细说明可参考代码编辑器。
• 界面预览：扣子 AI 生成的项目，可在工作区中查看并预览。
• 执行命令、查看输出：工作区下方设有终端区域，开发者可在此执行各类命令、调试项目，详细说明可查看终端；此外还有输出区域，展示应用或后端服务的输出信息。

编辑消息

支持修改开发者已发送的历史消息。
找到要编辑的消息，单击编辑图标之后即可修改自己发送的历史消息。
重新发送编辑后的 Query 相当于发起一次全新的对话请求。扣子 AI 将基于当前最新的项目状态和上下文来处理这个新的 Query。

重新生成

如果某一轮对话中，扣子 AI 的回复或者执行结果没有达到预期，你可以在对话区找到这条指令，点击重新生成图标，让扣子 AI 重新生成回复或执行操作。

上传文件

除自然语言之外，你还可以在输入框左下角单击 + 来上传附件，支持图片、代码文件等多种格式，作为扣子 AI 理解需求、生成代码或版本迭代的上下文和参考信息。

生成配置

控制扣子 AI 在处理当前 Query 时是否可以调用外部工具完成指定操作，例如调用联网搜索工具获取最新信息。开启某个工具后，扣子 AI 会自动根据任务需求，自行决定是否调用工具。

添加到对话

将代码片段、控制台或终端的输出、文件树中的文件、应用界面元素、工作流节点等元素添加到对话中，作为对话的上下文，提升用户与扣子 AI 协作的效率和精确性。

查看积分消耗

每轮对话结束后，你可以在扣子 AI 回复的末尾查看本轮对话消耗的积分数量。积分消耗和对话中各类资源消耗有关，详细说明可参考扣子编程任务费用。

查看代码文件

在文件树中单击指定代码文件，即可在工作区查看并编辑此文件。代码编辑器支持语法高亮、展示行号，还可以设置编辑器主题风格，提升交互体验。
如果 AI 修改了代码文件，也会高亮展示编辑前后的差异Diff），便于开发者理解代码的修改细节，从而更高效地进行代码审查。

编辑文件

支持前端 HTML/CSS、后端接口代码等多类型代码编辑，支持撤销和重做、变更自动保存等功能，保证代码编辑的灵活性和便捷性。常用的编辑器快捷键可参考编辑器快捷键。
你也可以将代码文件或代码片段添加到对话中，让扣子 AI 帮助你根据需求定向修改代码内容，提高编程效率。

代码检查

编辑器实时检查代码内容，可识别语法错误、编码规范问题、逻辑错误及安全漏洞，并提供详细的错误提示和修复建议，帮助开发者及时发现并解决代码中的潜在问题，确保代码的质量和安全性。

AI 解释、编辑代码

代码编辑器支持与扣子 AI 联动，你可以将代码文件、代码内容引用到对话区，让扣子 AI 解释代码含义、编写代码、修复问题。

执行命令行

终端支持开发者熟悉的基础命令执行能力，适配多开发场景的基础操作需求。

• 支持系统与开发相关的常规命令：比如执行npm install安装项目依赖、python run app.py启动后端服务等，与本地终端操作逻辑一致，降低开发者上手成本。
• 适配多环境命令解析：无论是前端的构建命令npm run build、后端的数据库连接命令，还是移动端的打包命令等，都能正常执行并在输出区域中实时打印日志，同时日志中会高亮标注错误信息，方便快速定位问题。

查看前端控制台输出

对于网页应用，你可以在控制台区域查看前端控制台输出的日志信息，支持清空和过滤，便于快速定位问题。控制台日志也会同步打印到日志文件，以供扣子 AI 读取并自动修复问题。

查看服务端输出

在输出区域查看服务端打印的日志信息，包括安装依赖、服务启动、运行过程等信息。服务端日志也会同步打印到日志文件，以供扣子 AI 读取并自动修复问题。

查看运行记录

开发智能体和工作流时，在右侧工作区的每一次试运行和调试记录都会被自动保存到工作区下方的运行记录中，你可以找到指定记录，查看各个节点的运行状态、输入输出数据等详细信息，便于对智能体和工作流进行问题排查。

AI 解释

终端支持与对话区联动，在遇到命令执行结果不明确时，你可以将终端区域中的命令回显等信息引用到对话中，让扣子 AI 来解释含义，辅助操作。

管理文件及文件夹

• 手动管理：你可以在终端中执行命令行来创建、删除、重命名文件或文件夹，实现对项目文件的灵活管理。
• 通过 AI 对话：你也可以将代码文件的管理操作交给扣子 AI，通过对话的方式让扣子 AI 为你管理项目文件或文件夹，例如创建、删除、重命名等基础操作。

导出项目

你可以在文件树右上角单击下载图标，一键下载项目代码的压缩文件。

上传文件

你可以拖拽上传本地文件，也可以拖拽方式移动文件、调整目录结构。
也可以单击上传图标，并选择本地文件来上传文件。

检索代码

一站式检索，检索范围为整个项目的所有代码文件。支持的检索方式如下：

• 关键词检索：根据关键词检索，可设置区分大小写、模糊或完全匹配。
• 正则匹配：根据正则表达式进行匹配。

如果检索结果过多，可以通过包含的文件和排除的文件进行二次筛选。

编辑器设置

编辑器主题

编辑器的主题会影响代码编辑器中的代码高亮风格。
目前支持 VSCode、GitHub、Duotone 主题。

如果你想设置扣子 AI 编程环境的整体主题，可以在页面右上角单击主题图标，设置整体 UI 主题，例如亮色或暗色模式。

字体设置

编辑器字体相关的设置。

• 字形：选择代码编辑器中用于显示文本的字体。
• 字体大小：设置代码编辑器中字体的大小。
• 行高：设置代码编辑器中文字的行高。

代码编辑行为

编辑代码时可用的高级设置。包括：

• 自动补全：控制是否启用代码自动补全功能。开启后，在您输入代码时编辑器会自动提供补全建议。
• 括号自动闭合：控制是否自动闭合括号和引号。开启后，当您输入 (, [, {, ', " 等起始符号时，编辑器会自动补全对应的结束符号。
• 制表符大小：设置按下 Tab 键时缩进的空格数量。

对话区设置

消息显示

在多轮对话中，如果对话数据量大，每次上滑鼠标查看历史对话时，系统会自动分段加载处理。分段加载数量用于设置每次加载的回复数量。

上下文管理

设置触发自动压缩的上下文长度阈值。当上下文长度达到模型上限的一定比例时，将自动触发压缩。

高级设置

调试模式

开启或关闭调试模式。排障场景下建议开启，可以在对话区查看每一轮对话的 LogID 和调试日志，便于扣子团队帮助你排查问题。

Option + B

切换文件目录可见性

Ctrl + 反引号

切换底部面板可见性

Option + N

打开新标签页

Option + W

关闭当前文件

cmd+f、ctrl+f

检索代码