使用 Pipet Code Agent 构建 AI Code Assistant

编写代码既有奖励，又让人满意，但让代码从“可运行”状态变为“可呈现”状态对同事来说往往是一项繁琐的工作。人工智能生成模型可帮助您添加代码注释，在人工审核员之前发现错误，以及执行许多其他任务，以简化您的编码工作流程。

本教程介绍了如何扩展 Pipet Code Agent，后者是由 Google 的 AI 开发者关系团队开发的一款 AI 赋能的代码辅助工具。此开源项目是 Microsoft Visual Studio Code (VS Code) 的扩展程序，可帮助您处理一些重要但不太有趣的编码任务，例如注释代码、查找错误和提出改进建议。该扩展程序会向 Gemini API 发送编码协助请求，并将回复整合到您的代码编辑窗口中。

您可以修改 Pipet 以使其更适合您，也可以构建新命令以更好地支持开发工作流。

有关此项目及其扩展方法的视频概览（包括构建该项目的人员的见解），请观看 AI Code Assistant - Build with Google AI。否则，您可以按照以下说明开始扩展项目。

项目设置

以下说明会引导您设置 Pipet Code Agent 项目，以用于开发和测试。常规步骤包括安装一些必备软件、设置一些环境变量、从代码库克隆项目，以及运行配置安装。

安装必备项

Pipet Code Agent 项目作为 Microsoft Visual Studio Code 的扩展程序运行，并使用 Node.js 和 npm 工具管理软件包和运行应用。以下安装说明适用于 Linux 主机。

如需安装所需的软件，请执行以下操作：

  1. 为您的平台安装 Visual Studio Code。
  2. 按照适用于您的平台的安装说明安装 node 和 npm。

克隆和配置项目

下载项目代码，然后使用 npm 安装命令下载所需的依赖项并配置项目。您需要使用 git 源代码控制软件来检索项目源代码。

如需下载并配置项目代码，请执行以下操作：

  1. 使用以下命令克隆 git 代码库。
    git clone https://github.com/google/generative-ai-docs
  2. （可选）将您的本地 Git 代码库配置为使用稀疏检出，这样您就只有文档代理项目的文件。
    cd generative-ai-docs/
git sparse-checkout init --cone
git sparse-checkout set examples/gemini/node/pipet-code-agent/
  3. 进入 Pipet Code Agent 项目根目录。 
    cd generative-ai-docs/examples/gemini/node/pipet-code-agent/
  4. 运行安装命令以下载依赖项并配置项目： 
    npm install

配置和测试扩展程序

现在，您应该能够通过在设备上的 VS Code 中运行 Pipet Code Agent 作为开发扩展程序来测试安装。该测试将打开一个单独的 VS Code Extension Development Host 窗口，其中提供了新扩展程序。在这个新窗口中，您需要配置扩展程序用于访问 Google Gemini API 的 API 密钥。

在“Extension Development Host”窗口中运行的 Pipet Code Agent 图 1. 包含 Pipet 扩展程序命令的 VS Code Extension Development Host 窗口。

如需配置和测试您的设置，请执行以下操作：

  1. 启动 VS Code 应用。
  2. 在 VS Code 中，依次选择 File > New Window 以创建一个新窗口。
  3. 依次选择文件 > 打开文件夹，然后选择 pipet-code-agent/ 文件夹，打开 Pipet Code Agent 项目。
  4. 打开 pipet-code-agent/package.json 文件。
  5. 依次选择 Run > Start Debugging，在调试模式下运行该扩展程序。此步骤将打开一个单独的 VS Code Extension Development Host 窗口。
  6. 依次选择 Code > Settings > Settings，打开 VS Code 设置。
  7. 从 Gennerative AI Developer 网站获取 Google Gemini API 密钥，然后复制密钥字符串。
  8. 将 API 密钥设为配置设置。在 Search Settings（搜索设置）字段中，输入 pipet，选择 User（用户）标签页，然后在 Google > Gemini: API Key（Google > Gemini：API 密钥）设置中，点击 Edit in settings.json（在 settings.json 中修改）链接，并添加您的 Genmini API 密钥：
    "google.gemini.apiKey": "your-api-key-here"
  9. 保存对 settings.json 文件所做的更改，然后关闭设置标签页。

如需测试扩展程序命令，请执行以下操作：

  1. 在 VS Code Extension Development Host 窗口中，选择编辑器窗口中的任何代码。
  2. 依次选择 View > Command Palette 以打开命令面板。
  3. 在 Command Palette 中输入 Pipet，然后选择一个具有该前缀的命令。

修改现有命令

要更改扩展程序的行为和功能，最简单的方法是修改 Pipet Code Agent 中提供的命令。注释和评价命令都使用几点提示方法，包含相关代码示例和注释，以及 AI 生成模型的一些常规说明。此提示上下文信息可指导 Gemini 生成模型形成回答。通过更改注释和/或评价命令中的提示指令和/或示例，您可以更改每个现有命令的行为。

本组说明介绍了如何通过更改 review.ts 命令的提示文本来修改该命令。

如需准备修改 review.ts 命令，请执行以下操作：

  1. 启动 VS Code 应用。
  2. 在 VS Code 中，依次选择 File > New Window 以创建一个新窗口。
  3. 依次选择文件 > 打开文件夹，然后选择 pipet-code-agent/ 文件夹，打开 Pipet Code Agent 项目。
  4. 打开 pipet-code-agent/src/review.ts 文件。

如需修改 review.ts 命令的行为，请执行以下操作：

  1. 在 review.ts 文件中，将 PROMPT 常量的开头更改为其他指令。 
    const PROMPT = '
Write review comments for following code, identifying bugs and ways to improve code quality. Examples of bugs are syntax errors or typos, out of memory errors, and boundary value errors. Examples of improving code quality are reducing complexity of code, eliminating duplicate code, and ensuring other developers
are able to understand the code.
${CODE_LABEL}
...
  2. （可选）在 review.ts 文件中，将另一个示例添加到代码和代码示例列表。 
    ...
${REVIEW_LABEL}
There are duplicate lines of code in this control structure.
${CODE_LABEL}
const fixed_value = 128;
${REVIEW_LABEL}
Make sure constant names are in all capitals (FIXED_VALUE) for clarity.
';
  3. 保存对 review.ts 文件的更改。

如需测试修改后的命令，请执行以下操作：

  1. 在 VS Code Pipet 扩展程序项目窗口中，依次选择 Run > Restart Debugging 来重启调试程序。
  2. 在 VS Code Extension Development Host 窗口中，选择编辑器窗口中的任何代码。
  3. 依次选择 View > Command Palette 以打开命令面板。
  4. 在 Command Palette 中输入 Pipet 并选择 Pipet: Review the selected code 命令。

创建新命令

您可以通过创建使用 Gemini API 执行全新任务的新命令来扩展 Pipet。每个命令文件（comment.ts 和 review.ts）大多是独立的，其中包含用于从活跃编辑器收集文本、撰写提示、连接到 Gemini API、发送提示以及处理响应的代码。

填充代码代理，其中包含“Name the selection function”（命名选择函数） 图 2. VS Code Extension“Development Host”窗口中添加了新的函数名称推荐命令。

本组说明介绍了如何使用现有命令的代码 comment.ts 作为模板构建新命令。

如需创建建议函数名称的命令，请执行以下操作：

  1. 在 src/ 目录中创建名为 name.ts 的 pipet-code-agent/src/comment.ts 文件的副本。
  2. 在 VS Code 中，打开 src/name.ts 文件。
  3. 通过修改 PROMPT 值来更改 name.ts 文件中的提示说明。 
    // Provide instructions for the AI generative model
const PROMPT = `Recommend a name for this function. Explain your
reasoning in 3 sentences or less:`;
  4. 更改命令函数的名称及其信息消息。 
    export async function generateName() {
  vscode.window.showInformationMessage('Generating function name...');
  5. 更新提示汇编代码，使其仅包含 PROMPT 值和在编辑器中选择的文本。 
      // Build the full prompt using the template.
  const fullPrompt = `${PROMPT}
"
${selectedCode}
"
`;
  6. 更改响应输出，描述生成的内容。 
        // update prefix to describe output
    let commentIntro = padding + commentPrefix + "Recommended name: (generated)\n";
    editBuilder.insert(selection.start, commentIntro);
    editBuilder.insert(selection.start, pyComment);
  7. 保存对 review.ts 文件的更改。

集成新命令

完成新命令的代码后，您需要将其与扩展程序的其余部分集成。更新 extension.ts 和 package.json 文件，使新命令成为扩展程序的一部分，并启用 VS Code 来调用新命令。

如需将 name 命令与扩展程序代码集成，请执行以下操作：

  1. 在 VS Code 中，打开 pipet-code-agent/src/extension.ts 文件。
  2. 通过添加新的 import 语句，将新的代码文件添加到扩展程序。 
    import { generateName } from './name';
  3. 将以下代码添加到 activate() 函数，以注册新命令。 
    export function activate(context: vscode.ExtensionContext) {
    ...
    vscode.commands.registerCommand('pipet-code-agent.nameFunction', generateName);
}
  4. 保存对 extension.ts 文件的更改。

如需将 name 命令与扩展程序软件包集成，请执行以下操作：

  1. 在 VS Code 中，打开 pipet-code-agent/package.json 文件。
  2. 将新命令添加到软件包文件的 commands 部分。 
      "contributes": {
    "commands": [
      ...
      {
        "command": "pipet-code-agent.nameFunction",
        "title": "Pipet: Name the selected function."
      }
    ],
  3. 保存对 package.json 文件的更改。

测试新命令

完成对命令的编码并将其与扩展程序集成后，您可以对其进行测试。您的新命令仅在 VS Code Extension Development Host 窗口中可用，而不在您修改扩展程序代码的 VS Code 窗口中可用。

如需测试修改后的命令，请执行以下操作：

  1. 在 VS Code Pipet 扩展程序项目窗口中，依次选择 Run > Restart Debugging 来重启调试程序，此操作会重启单独的 Extension Development Host 窗口。
  2. 在 VS Code Extension Development Host 窗口中，选择编辑器窗口中的一些代码。
  3. 依次选择 View > Command Palette 以打开命令面板。
  4. 在 Command Palette 中输入 Pipet，然后选择 Pipet: Name the selected function 命令。

其他资源

如需详细了解 Pipet Code Agent 项目，请参阅代码库。 如果您在构建应用方面需要帮助，或者正在寻找开发者协作者，请查看 Google Developers 社区 Discord 服务器。

生产应用

如果您计划为大量受众群体部署 Google 文档代理，请注意，您在使用 Google Gemini API 时可能会受到速率限制和其他使用限制的约束。如果您考虑使用 Gemini API 构建生产应用（例如 Docs Agent），请查看 Google Cloud Vertex AI 服务以提高应用的可伸缩性和可靠性。