Preview

CodeBuddy IDE 支持通过浏览器内核自动渲染代码修改后的运行效果，允许您在不切换工具、不手动启动服务的情况下，即时查看当前工程代码的运行效果，实现实时调试和预览。

实时预览

有以下两种方式可以打开本地工程预览：

• 在 CraftAgent 下代码生成或修改执行完后 Agent 自动调用工具打开 Preview 。

• 手动点击 Preview 工具进行预览。 或者手动输入 Prompt 来触发 Agent 打开 Preview，实时预览运行效果，例如：

预览效果如下图所示：

视觉优化

在预览页面中，您可以选择部分组件添加到对话中，并通过自然语言对 UI 进行优化。

1. 单击局部修改按钮。

2. 选择组件，选择后会自动添加到对话框中。

3. 在对话框中输入需求描述，Agent 将根据您的需求自动修改代码，例如：

4. 优化后的效果如下所示，可以看到，按钮已调整为蓝色背景，如果还不满意，您可以继续进行视觉的样式优化。