Gemini 1.5 Pro の 2M コンテキストウィンドウ、コード実行機能、Gemma 2 を利用できるようになりました。詳細

このページは Cloud Translation API によって翻訳されました。

Pipet Code Agent を使用して AI コードアシスタントを構築する

コードを書くのはやりがいも満足感もありますが、仕事を同僚のためにプレゼンターに変えるのは、しばしば雑務です。人工インテリジェンス生成モデルでは、コードコメントの追加、人間が行う前に検出し、その他のさまざまなタスクを実行して、コーディングワークフローが簡単になります

このチュートリアルでは、Google Cloud で Pipet Code Agent Google Cloud の AI デベロッパーリレーションズチームが構築した AI 搭載のコードアシスタンスツール Googleこのオープンソースプロジェクトは Microsoft Visual Studio の拡張機能です。 Code（VS Code）です。コーディングの重要ではあるものの楽さは低いタスク（コメント、間違いの発見、改善の提案といったタスクが含まれます。この拡張機能はコーディング支援リクエストを Gemini API に送信し、その応答をコード編集ウィンドウを開きます

Pipet は新しいコマンドを作成して開発ワークフローのサポートを強化できます

プロジェクトの概要と拡張方法（分析情報を含む）の動画ご覧ください。 AI Code Assistant - Google AI でビルドする。それ以外の場合は、手順に沿ってプロジェクトの拡張を開始できます。ご覧ください

プロジェクトの設定

ここでは、Pippet Code Agent プロジェクトをセットアップする手順について説明します。開発とテストに使用できます。一般的な手順では、いくつかの前提条件をインストールします。環境変数の設定、コードからのプロジェクトのクローン作成、構成のインストールを実行します。

前提条件をインストールする

Pipet Code Agent プロジェクトは、Microsoft Visual Studio の拡張機能として動作します。コードであり、 Node.js と、管理用の npm ツールアプリケーションをパッケージ化して実行します。次のインストール手順は、作成する必要があります。

必要なソフトウェアをインストールするには:

Visual Studio Code をインストールする検討してください
インストールの手順に沿って、node と npm をインストールします。手順をご覧ください。

プロジェクトのクローンを作成して構成する

プロジェクトコードをダウンロードし、npm インストールコマンドを使用してダウンロードします。プロジェクトを構成します。必要な取得する git ソース管理システムソースコードを変更せずに済みます

プロジェクトコードをダウンロードして構成するには:

次のコマンドを使用して Git リポジトリのクローンを作成します。
```
git clone https://github.com/google/generative-ai-docs
```
必要に応じて、スパースチェックアウトを使用するようにローカルの Git リポジトリを構成します。ドキュメントエージェントプロジェクトのファイルのみが含まれることになります。
```
cd generative-ai-docs/
git sparse-checkout init --cone
git sparse-checkout set examples/gemini/node/pipet-code-agent/
```
Pipet Code Agent プロジェクトのルートディレクトリに移動します。
```
cd generative-ai-docs/examples/gemini/node/pipet-code-agent/
```
インストールコマンドを実行して依存関係をダウンロードし、プロジェクトを構成します。
```
npm install
```

拡張機能を構成してテストする

Pipet Code Agent を VS Code の開発拡張機能を使用できます。テストでは、VM ごとに個別の新しい拡張機能を利用できる Code Extension Development Host ウィンドウ。この新しいウィンドウで、拡張機能がアクセスに使用する API キーを設定します。 Google Gemini API。

図 1. Pipet が表示されている VS Code Extension Development Host ウィンドウ使用できます。

設定を構成してテストするには:

VS Code アプリケーションを起動します。
VS Code で、[File] >新しいウィンドウ。
[File >フォルダを開く pipet-code-agent/ フォルダを選択します。
pipet-code-agent/package.json ファイルを開きます。
[Run] >デバッグを開始するをご覧ください。この手順では、別の VS Code の [Extension Development Host] ウィンドウを開きます。
[Code] >設定 >設定。
Google Gemini API キーをキー文字列をコピーします。
API キーを構成設定として指定します。[検索の設定] フィールドに「pipet」と入力し、[User] タブを選択して、[Google >Gemini: [API キー] 設定を開き、[settings.json で編集] リンクをクリックし、 Gemini API キー:
```
"google.gemini.apiKey": "your-api-key-here"
```
settings.json ファイルに変更を保存し、設定タブを閉じます。

で確認できます。

拡張機能コマンドをテストするには:

VS Code の [Extension Development Host] ウィンドウで、任意のコードを選択します。をクリックします。
[表示 >コマンドパレット。
コマンドパレットで「Pipet」と入力し、使用します。

既存のコマンドを変更する

Pipet Code Agent で提供されているコマンドを変更することは、拡張機能の動作と機能を変更します。コメントとコマンドの確認には、少数ショットプロンプトそのコードのサンプルとコードのコメントに加え、いくつかの一般的な手順を説明しました。このプロンプトコンテキスト Gemini 生成モデルが回答を生成する際の指針となります。方法コメントまたはプロンプトでプロンプトの指示、例、またはその両方を既存の各コマンドの動作を変更できます。

ここでは、review.ts コマンドを変更する方法について説明します。コマンドのプロンプトテキストを変更します。

review.ts コマンドの編集を準備するには:

VS Code アプリケーションを起動します。
VS Code で、[File] >新しいウィンドウ。
[File >フォルダを開く pipet-code-agent/ フォルダを選択します。
pipet-code-agent/src/review.ts ファイルを開きます。

review.ts コマンドの動作を変更するには:

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}
...

必要に応じて、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.
';

変更を review.ts ファイルに保存します。

変更したコマンドをテストするには:

VS Code Pipet 拡張機能のプロジェクトウィンドウで、次のコマンドを実行してデバッガを再起動します。 [Run >デバッグを再開する。
VS Code の [Extension Development Host] ウィンドウで、任意のコードを選択します。をクリックします。
[表示 >コマンドパレット。
コマンドパレットで「Pipet」と入力し、[Pipet: を選択します。

新しいコマンドを作成

まったく新しいタスクを実行する新しいコマンドを作成して、Pippet を拡張できます生成 AI です各コマンドファイル（comment.ts と review.ts）のほとんどは、自己完結型であり、アクティブなエディタからテキストを収集するためのコードが含まれています。プロンプトの作成、Gemini API への接続、プロンプトの送信、処理の返されます。

[Name the Selection] 関数が表示されている Pipet Code Agent 図 2. VS Code 拡張機能の新しい関数名推奨コマンド [Development Host] ウィンドウ

この手順では、次のコードを使用して新しいコマンドを作成する方法を説明します。既存のコマンド comment.ts をテンプレートとして作成する。

関数名を推奨するコマンドを作成するには:

pipet-code-agent/src/comment.ts ファイルのコピーを作成します。（src/ ディレクトリにある name.ts）というファイルです。
VS Code で src/name.ts ファイルを開きます。

name.ts ファイルのプロンプトの手順を次のように変更します。 PROMPT 値を編集します。

// Provide instructions for the AI generative model
const PROMPT = `Recommend a name for this function. Explain your
reasoning in 3 sentences or less:`;

コマンド関数の名前と情報メッセージを変更します。

export async function generateName() {
  vscode.window.showInformationMessage('Generating function name...');

PROMPT のみを含めるようにプロンプトアセンブリコードを更新します。値とエディタで選択されたテキストが表示されます。
```
  // Build the full prompt using the template.
  const fullPrompt = `${PROMPT}
"
${selectedCode}
"
`;
```

レスポンス出力を変更して、何が生成されているかを説明します。

    // update prefix to describe output
    let commentIntro = padding + commentPrefix + "Recommended name: (generated)\n";
    editBuilder.insert(selection.start, commentIntro);
    editBuilder.insert(selection.start, pyComment);

変更を review.ts ファイルに保存します。

新しいコマンドを統合する

新しいコマンドのコードが完成したら、コードをできます。extension.ts ファイルと package.json ファイルを次のように更新します。新しいコマンドを拡張機能の一部にして、VS Code で使用します。

name コマンドを拡張機能コードと統合するには:

VS Code で pipet-code-agent/src/extension.ts ファイルを開きます。
新しいインポートを追加して、新しいコードファイルを拡張機能に追加するステートメントです。
```
import { generateName } from './name';
```

次のコードを activate() 関数を使用します。

export function activate(context: vscode.ExtensionContext) {
    ...
    vscode.commands.registerCommand('pipet-code-agent.nameFunction', generateName);
}

変更を extension.ts ファイルに保存します。

name コマンドを拡張機能パッケージと統合するには:

VS Code で pipet-code-agent/package.json ファイルを開きます。

パッケージの commands セクションに新しいコマンドを追加します。表示されます。

  "contributes": {
    "commands": [
      ...
      {
        "command": "pipet-code-agent.nameFunction",
        "title": "Pipet: Name the selected function."
      }
    ],

変更を package.json ファイルに保存します。

新しいコマンドをテストする

コマンドのコーディングとテストできます。新しいコマンドは VS Code でのみ使用できます。 [Extension Development Host] ウィンドウに表示できます。拡張機能のコードを編集しました。