Agentforce Vibes IDE 基础

Agentforce Vibes IDE 是把 VS Code 能力装进浏览器的云端 Salesforce 开发环境,内置 AI 驱动的 Vibe Coding 与 MCP 助手。本文介绍它是什么、与 VS Code 的差异、支持的版本与用户界面,讲解如何在 org 中启用、授权并创建 DX 项目,并演示用 Vibe Coding 构建匿名 Apex、用 Quick Fix 菜单排错,以及用 SOQL Builder 可视化查询数据。...

📅 2026/10/7 ✍️ ponybai 🏷️ salesforce, headless

一、开始使用 Agentforce Vibes IDE

slide_2
slide_3

本单元介绍 Agentforce Vibes IDE——它是什么、与 VS Code 的差异、支持的版本、用户界面,以及 Vibe Coding 与 agent 模式。

学完本单元,你将能够:解释 Agentforce Vibes IDE 的特性、描述 VS Code 与基于 Web 的 Agentforce Vibes IDE 的差异、列出支持的版本、列出 IDE 的界面元素、描述 vibe coding 的 agent 模式。

什么是 Vibes IDE、与 VS Code 的差异及界面(What Is Vibes IDE, Differences from VS Code, and the UI)

slide_4

如果你想用更快、更精简的方式在 Salesforce 上构建,又不想被本地安装折腾,那么 Agentforce Vibes IDE 就是答案——它把 Visual Studio Code(VS Code)的全部能力与灵活性装进了你的浏览器。

这个现代集成开发环境(IDE)可直接在你的 sandbox org 中使用,开箱即用地加载了构建应用所需的一切。使用时,你会创建并工作在一个 Salesforce DX(SFDX)项目中——这是现代、以源代码驱动的 Salesforce 开发的标准格式。由于 Vibes IDE 完全在云端运行,管理员和开发者都能随时随地工作:收藏你的开发环境即可稍后回来继续,或从另一台机器访问链接而不会丢失设置。

关键特性:

  • 完整的开发环境:省去数小时配置。Salesforce 扩展、Salesforce CLI 与无缝的 GitHub 集成从登录那一刻起就已就绪,让你专注于构建。
  • AI 驱动的开发:环境预装 Agentforce Vibes 扩展,提供 MCP 驱动的 agentic chat,改变你写代码、构思方案与排查 bug 的方式。
  • 即时的 org 集成:从 org 的 Setup 菜单启动 IDE 即可即时认证,org 元数据自动加载到项目,无需手动设置。

与 VS Code 的差异:核心 Salesforce 扩展在桌面端与浏览器端功能相同,但浏览器环境有几点独特行为:

  • 安装:Vibes IDE 零安装、完全在浏览器运行;VS Code 需本地安装。
  • Org 连接:Vibes IDE 即连即用、org 感知,从 Setup 菜单启动并自动认证、加载元数据;VS Code 需手动安装 Salesforce CLI 并在终端手动认证。
  • 扩展市场:Vibes IDE 从 Eclipse Foundation 的 Open VSX 市场打开扩展(厂商中立、开源,无专有锁定);VS Code 使用微软市场,限制非微软系统托管扩展。
  • 维护:Vibes IDE 免维护,Salesforce 自动更新核心扩展;VS Code 需手动更新扩展与 CLI。
  • AI 集成:Vibes IDE 预装 Agentforce Vibes 的 MCP agentic chat;VS Code 可选,需手动配置扩展与 API。

支持的版本:Agentforce Vibes IDE 在 Developer Edition 与 Lightning Experience 的 sandbox 中可用,支持 Enterprise、Unlimited、Professional(需 API Access 附加组件)版本。注意:它不可用于生产 org;也不在 EU Operating Zone 与 Government Cloud 中可用(EU 中不属 EU OZ 的 org 按标准产品条款支持)。

用户界面:如果你熟悉 VS Code,在 Vibes IDE 里会宾至如归——界面几乎一致,但增强了扩展包以加速开发。界面分五个主要区域:

  1. Activity bar(活动栏):存放切换不同视图的图标。
  2. Side bar(侧边栏):根据你在活动栏的选择而变化,此处示例为 Explorer 视图。
  3. Editors(编辑器):你实际编写与编辑代码的中央区域。
  4. Output panel(输出面板):反馈指挥中心,显示调试信息、日志、错误与警告,并容纳集成终端。
  5. Status bar(状态栏):显示当前文件信息,最重要的是显示你连接的 Salesforce org。

最常交互的工具:Explorer(侧边栏里的"文件柜",显示整个 SFDX 项目结构);Salesforce Org Browser(无需离开 IDE 即可直接查看已连接 org 的云元数据与组件,一键拉入项目);Extensions(列出已装插件,可搜索安装新扩展);Agentforce Vibes(打开 AI 驱动的开发助手,让你进行 vibe coding);Command Palette(按 Ctrl+Shift+P / Command+Shift+P,输入 SFDX 查看 Salesforce 专属操作)。

什么是 Vibe Coding 与 Agent 模式(What Is Vibe Coding and Agent Modes)

slide_5

Vibe coding 是一种现代、AI 驱动的软件开发实践:用自然语言提示来构建应用与功能,而不是逐行写代码。

提示(prompt)就是你写给 AI 的自然语言消息。使用 Agentforce 时,提示的清晰度直接决定生成代码的质量,因此稍作提示工程(精心打磨指令)会有很大差别。你也无需一次做到完美——可以随时发送后续请求来细化输出,直到得到所需结果。提示必须包含动作、上下文与最佳实践。例如:「为线索页构建一个小按钮,写着『复制电话号码』。点击后把线索的电话号码复制到电脑剪贴板,并显示一条快速成功消息。」

Agent 模式:Agentforce AI agent 有两种交互模式,帮你更聪明地工作:Plan 模式(战略思考)与 Act 模式(实施)。这种组合帮你做出更好的设计决策、减少编码错误,可在聊天面板右下角的开关随时切换。

  • Plan 模式(战略思考):用于新功能、复杂调试或架构设计。例如「我需要添加一个客户门户功能,帮我理解涉及什么」,Agentforce 会分析你的 org 设置、对象与安全,给出路线图。
  • Act 模式(实施):用于写代码、处理常规变更或遵循既有模式。例如「为门户界面创建 Lightning 组件」,它会生成 LWC、编写 Jest 测试并连接到数据。内置的 Focus Chain 功能会自动管理任务列表并跟踪进度。

二、设置 Agentforce Vibes IDE

slide_6
slide_7

本单元学习如何启用 Agentforce Vibes IDE、授权连接到 org,并创建 DX 项目。

学完本单元,你将能够:开启 Agentforce Vibes IDE、授权其连接 org、创建 DX 项目。

设置——启用、授权、安装与创建项目(Setup — Enable, Authorize, Install, and Create Project)

slide_8

你必须以 System Administrator 身份正式为 org 启用 Agentforce Vibes IDE。前提是你的 sandbox org 已启用 API 访问(Professional Edition 需联系客户经理申请 API 附加组件)。管理员启用步骤:1) 以 System Administrator 登录 org;2) 在 Setup 菜单搜索并选择 Agentforce Vibes;3) 审阅条款与条件(这份统一协议也覆盖 DevOps Center、DX Inspector、Scale Center 等工具);4) 点击 Accept 开启,此后 sandbox 中任何拥有 View All Data 权限的用户都可用。

授权连接:Vibes IDE 在你当前登录的 org 上运行所有命令,并自动将其设为开发默认 org。进入前必须授权连接,IDE 才能安全交互:

  1. 在 org 点击 Setup,选择 Agentforce Vibes 启动 IDE。
  2. 打开命令面板(Command+Shift+P / Ctrl+Shift+P),运行 SFDX: Authorize an Org 或 SFDX: Create a Default Scratch Org。
  3. 选择 org 类型并输入别名。
  4. 复制/记下显示的验证码。
  5. 在浏览器打开的登录页登录 org。
  6. 输入验证码并点击 Allow 完成授权。

连接后:验证状态会显示为通知;连接 org 的名称显示在状态栏;点击状态栏 org 名或 No Tracing 可切换/设置默认 org;点击状态栏 Open Default Org in Browser 可在浏览器打开默认 org;运行 SFDX: Log Out from Default Org 可登出。

安装或更新 Salesforce Extensions Pack:该扩展包包含应用开发工具。在 IDE 进入 Extensions,搜索 Salesforce Extensions Pack(官方工具)或 Salesforce Extensions Pack (Expanded)(官方 + 社区工具),点击 Install 或 Update。

创建 DX 项目:首次启动 Vibes IDE 会看到一个干净的空 SFDX 项目。Salesforce DX(Salesforce Developer Experience)是现代化应用构建方式的开发模型与工具集,把开发从共享、以 org 为中心的环境转向源代码驱动的工作流,支持本地管理代码或使用 Git 等版本控制。创建项目:

  1. 点击活动栏的 Agentforce Vibes。
  2. 在侧边栏点击 +New Project,浏览可创建的项目类型。
  3. 选择 Lightning App 卡片创建示例 Lightning App 项目。
  4. 点击 Create Project,输入项目名或更改位置。

也可通过命令面板运行 SFDX: Create Project 创建标准模板项目。项目结构:Salesforce 自动加载标准配置文件——.gitignore(让 Git 跳过临时文件)、.prettierrc/.prettierignore(Prettier 代码格式化)、.vscode/extensions.json 与 .vscode/launch.json(配置 Replay Debugger 回放调试)、.vscode/settings.json(自定义默认行为与自动化规则,含保存时自动部署选项,默认关闭)。

三、用 Vibe Coding 构建

slide_9
slide_10

本单元用 vibe coding 让 AI agent 创建一个匿名 Apex 脚本更新联系人,并使用 Quick Fix 菜单处理生成的代码。

学完本单元,你将能够:vibe code 一个更新联系人的匿名 Apex 脚本,并对生成的 Apex 代码使用 Quick Fix 菜单选项。

Vibe Code 匿名 Apex、构建提示与运行代码(Vibe Code Apex, Build Prompts, and Run Code)

slide_11

匿名 Apex 脚本是一段可编译运行但无需存储元数据的代码。本单元用 vibe coding 让 AI agent 为你创建匿名 Apex 脚本。

场景:数据团队刚导入一批遗留企业联系人,但很多人缺失个人邮箱或包含旧的坏数据。为确保自动化系统不触发退信,你需要找出所有与企业账户关联的联系人,把他们的数字通信临时路由到匹配公司名的通用邮箱 info@[companyname].com(去掉空格)。

构建提示:提示必须包含动作、上下文与最佳实践——动作「创建匿名 Apex 代码块遍历联系人及其公司名」;上下文「把个人邮箱改为 'info@' + 公司名 + '.com'」;最佳实践「去掉所有空格」。完整提示:Create an anonymous Apex block to loop through Contacts and their company names. Change the individual email addresses to 'info@' plus their company name plus '.com'. Remove any white spaces. 输入提示后回车,审查生成的 Apex 代码。

用内联自动补全编辑 Apex:内联自动补全是 Vibes IDE 的 AI 编辑器特性,实时预测并建议代码的下一部分——它结合当前文件上下文,预测整行、参数甚至整块代码,而不仅是单个变量名。建议通常以灰色文字出现在光标前,按 Tab 接受。

运行 Apex 代码:点击代码块顶部的 Execute,或在聊天窗口输入提示让 agent 帮你运行(如 Run the open anonymous Apex code),然后查看 org 上联系人邮箱的变化。

Quick Fix 菜单:它是编辑器内置的"代码医生"。当你有拼写错误、忘记声明变量或写出违反编码规则的内容时,IDE 会用红色或黄色波浪下划线标记;点击标记文字会出现灯泡图标,点击灯泡或按 Command+. / Ctrl+. 打开 Quick Fix 菜单。可用它:Add to Agentforce(把代码发送到主 AI 助手面板讨论)、Explain with Agentforce(用大白话解释代码块)、Improve with Agentforce(自动优化、清理或重构代码)。

四、用 SOQL Builder 查询数据

slide_12
slide_13

本单元学习用 SOQL Builder 构建并运行查询,以及检索查询计划优化性能。

学完本单元,你将能够:用 SOQL Builder 构建并运行查询,并检索查询计划。

SOQL Builder、查询计划与总结(SOQL Builder, Query Plans, and Wrap Up)

slide_14

SOQL Query Builder 是 Salesforce Extension Pack 内置的便捷工具,让你用可视化、表单式的界面构建简单数据库查询,无需从头输入 SOQL。你可以点击选择对象、字段、应用过滤器,运行查询即时查看结果,并把数据直接保存为 .CSV 或 .JSON 文件。

场景:在一次严重的支持高峰中,你需要立即导出所有 High Priority 工单的 .CSV,显示客户邮箱与工单主题,以重新分配团队工作量。与其从头写查询或冒语法错误的风险,不如用可视化的 SOQL Query Builder。

构建并运行查询:1) 打开命令面板,输入 SFDX: Create Query in SOQL Builder;2) 命名查询为 HighPrio;3) 选择存储目录。然后:From 选 Case;Fields 选 ContactEmail 与 Subject;Filter 选 Priority = High。选择时能在 SOQL Query 框看到实际查询被构建。

点击 Run Query,在结果页点击 .CSV 选择保存位置并点击 OK。

检索查询计划:Query Plan 工具是 Salesforce 数据库的性能诊断器。处理海量数据时,未优化的查询会拖慢系统或触发超时。该工具把查询执行拆解为具体操作并为每项分配成本分数,高亮 Salesforce 实际使用的计划。通过分析成本,你能识别性能瓶颈、确定在哪里建索引、优化查询速度。要检索查询计划,打开查询并点击 Get Query Plan,计划会在 Output panel 中打开。

总结:你现在掌握了完整的 Vibes IDE 工具包——从用于 Apex 开发的 Vibe Coding,到用于数据访问的可视化 SOQL。继续深入可参考 Trailhead: Apex Basics & Database 与 Developer Guide: Query Records。


文章来源:Trailhead - Agentforce Vibes IDE Fundamentals