VS Code Agent Mode(エージェントモード)とは?|AIが自動でコード編集からテストまで実行

プログラミング・IT

「複数のファイルにまたがる大きなリファクタリングをしたいけど、時間がかかりそう」
「新機能を追加したいが、どのファイルを修正すればいいか迷ってしまう」
「テストを書いて、失敗したら修正して…という作業を自動化できたら」

そんな開発者の悩みを解決してくれるのが、VS Codeの**Agent Mode(エージェントモード)**です。

この機能は、GitHub CopilotのAIがあなたに代わって複数のファイルにまたがる編集やターミナルコマンドを実行し、自律的にタスクを完遂してくれる革新的な機能です。まるでAIが優秀なペアプログラマーとして働いてくれるような体験を提供します。

この記事では、VS Code Agent Modeの基本的な仕組みから実際の使い方、活用のコツまでを詳しく解説します。

スポンサーリンク

VS Code Agent Mode(エージェントモード)とは

基本的な概念

Agent Modeは、GitHub CopilotのAIが「あなたに代わって」以下のような作業を自動で行ってくれるモードです:

  • 複数のファイルにまたがる編集作業
  • ターミナルでのコマンド実行
  • テストの実行と結果に基づく修正
  • コード品質チェックとエラー修正

従来の編集との違い

通常の編集モード

  • ファイル単位での提案
  • 人間が次のステップを判断
  • 一つずつ手動で作業を進める

Agent Mode

  • ワークスペース全体を理解
  • AIが最適な手順を自動で判断
  • 複数ステップを連続で実行
  • エラーが発生したら自動で修正を試行

どんなタスクに向いているか

Agent Modeが得意なタスク:

  • 複雑なリファクタリング作業
  • 新機能の追加(複数ファイルの修正が必要)
  • 複数ファイルにわたる一括修正
  • APIの変更に伴うコード更新
  • テスト駆動開発のサイクル自動化

通常の編集モードが適しているタスク:

  • 単一ファイルの小さな修正
  • 簡単なバグ修正
  • コメントの追加

Agent Modeの有効化と設定

前提条件

Agent Modeを使用するには、以下の条件を満たす必要があります:

  1. VS Code 1.99以上がインストールされている
  2. GitHub Copilotのサブスクリプションが有効
  3. GitHub Copilot Chat拡張機能がインストールされている

有効化の手順

設定ファイルでの有効化

VS Codeの設定ファイル(settings.json)に以下を追加します:

{
  "chat.agent.enabled": true
}

GUI設定での有効化

  1. Ctrl + ,(MacはCmd + ,)で設定を開く
  2. 検索欄に「chat agent」と入力
  3. 「Chat: Agent Enabled」にチェックを入れる

将来の展開

現在はベータ機能ですが、やがて全ユーザーにデフォルトで導入される予定です。早めに使い方を覚えておくと、開発効率の向上に大きく役立ちます。

Agent Modeの使い方

基本的な操作手順

チャットビューを開く

Agent Modeは、VS CodeのChat機能を通じて使用します:

Ctrl + Alt + I(Windows・Linux)
⌃⌘I(Mac)

または、サイドバーのチャットアイコンをクリックします。

Agent Modeに切り替え

  1. チャットビューの上部にあるモード切り替えボタンをクリック
  2. 「Agent」を選択

タスクの指示

自然言語でやりたいことを指示します。例:

OAuthログイン機能を追加して、
- ログインページを作成
- 認証フローを実装
- ユーザー情報を管理する仕組みを構築

AIの提案を確認・承認

  1. AIが作業計画を提示
  2. 各ステップの内容を確認
  3. 実行したいものを承認

変更内容の確認

  1. Diffビューで変更内容を確認
  2. Accept(承認)またはDiscard(破棄)を選択
  3. 必要に応じて部分的な修正も可能

実際の使用例

例1:新しいAPIエンドポイントの追加

指示:

ユーザー一覧を取得するAPIエンドポイント /api/users を追加して、
- ルーティングの設定
- コントローラーの実装
- バリデーション
- テストコード
全部含めて作成してください

AIの実行内容:

  1. ルーティングファイルに新しいエンドポイントを追加
  2. コントローラーファイルを作成・実装
  3. バリデーションスキーマを定義
  4. テストファイルを作成
  5. テストを実行して動作確認
  6. エラーがあれば自動で修正

例2:レガシーコードのリファクタリング

指示:

src/legacy フォルダのコードを現代的なES6記法にリファクタリングして、
- var を let/const に変更
- 関数宣言をアロー関数に
- Promiseをasync/awaitに
- 既存のテストが通ることを確認

AIの実行内容:

  1. 対象ファイルを特定
  2. 段階的にコードを現代化
  3. 各ステップでテストを実行
  4. テストが失敗したら修正を試行
  5. 最終的な動作確認

Agent Modeの特長と利点

自律的なマルチステップ編集

Agent Modeの最大の特長は、AIが自分で作業手順を考えて実行してくれることです:

従来の方法:

  1. 人間がファイルAを修正
  2. 人間がファイルBを修正
  3. 人間がテストを実行
  4. エラーが出たら人間が原因を調査
  5. 人間が修正作業を繰り返し

Agent Mode:

  1. AIが全体の作業計画を立案
  2. AIが最適な順序でファイルを修正
  3. AIが自動でテストを実行
  4. エラーが出たらAIが原因を分析
  5. AIが自動で修正を試行

テストやlintの監視と自動修正

Agent Modeでは、コード変更後に自動でテストやリンターを実行し、問題があれば修正を試みます:

  • テスト実行:変更後に関連テストを自動実行
  • Lint チェック:コード品質をリアルタイムで監視
  • 自動修正:エラーやワーニングを自動で解決
  • 品質保証:最終的なコード品質を担保

Model Context Protocol(MCP)対応

Agent ModeはMCPに対応しており、外部ツールやサービスとの連携が可能です:

  • データベース操作:マイグレーションファイルの自動生成
  • API連携:外部サービスとの統合
  • デプロイ作業:CI/CDパイプラインとの連携
  • 監視ツール:ログ解析やパフォーマンス監視

Agent Modeのツールとセキュリティ

標準で使用できるツール

Agent Modeには、以下のツールが標準で組み込まれています:

ファイル操作

  • ファイルの作成・編集・削除
  • フォルダ構造の変更
  • ファイル内容の検索・置換

ターミナル実行

  • npmコマンドの実行
  • ビルドスクリプトの実行
  • テストコマンドの実行
  • Git操作

Web取得

  • 外部APIの呼び出し
  • ドキュメントの参照
  • ライブラリ情報の取得

MCPサーバー連携

Model Context Protocolを通じて、さらに多くのツールと連携できます:

データベース連携

{
  "mcp.servers": {
    "postgres": {
      "command": "npx",
      "args": ["@modelcontextprotocol/server-postgres"],
      "env": {
        "POSTGRES_CONNECTION_STRING": "postgresql://..."
      }
    }
  }
}

Slack連携

{
  "mcp.servers": {
    "slack": {
      "command": "npx",
      "args": ["@modelcontextprotocol/server-slack"],
      "env": {
        "SLACK_BOT_TOKEN": "xoxb-..."
      }
    }
  }
}

セキュリティと承認制

Agent Modeは強力な機能ですが、安全性も重視されています:

承認制システム

  • 事前確認:ツール実行前にユーザーに確認
  • 選択的実行:不要な操作はスキップ可能
  • 段階的承認:各ステップごとに確認

権限管理

  • 最小権限の原則:必要最小限の権限のみ使用
  • 実行ログ:すべての操作が記録される
  • ロールバック:問題があれば変更を巻き戻し可能

効果的な使い方とコツ

大規模タスクに最適化

Agent Modeは、以下のような大規模なタスクで真価を発揮します:

フレームワークの移行

ReactからNext.jsに移行したい。
- ルーティングをNext.js式に変更
- SSRに対応した形でコンポーネントを修正
- パフォーマンスを維持しながら段階的に移行
- 既存のテストも更新

アーキテクチャの改善

モノリスをマイクロサービスに分割したい。
- 認証サービスを分離
- ユーザー管理サービスを独立
- API Gateway経由でのルーティング
- Docker化と設定ファイル作成

軽いタスクはEditモードを使い分け

小さな修正やシンプルな変更には、通常のEditモードの方が効率的です:

Agent Mode向き:

  • 10ファイル以上の修正
  • 新機能の追加
  • アーキテクチャ変更

Edit Mode向き:

  • 単一ファイルの修正
  • バグ修正
  • コメント追加

クォータ消費への注意

Agent Modeは高度な機能ですが、GitHub Copilotのクォータを多く消費します:

節約のコツ

  • 明確な指示:曖昧な指示は無駄な試行を増やす
  • 段階的実行:大きなタスクは小分けにする
  • 事前計画:何をしたいか明確にしてから指示

使用量の監視

  • GitHub Copilotの使用状況を定期的に確認
  • チーム全体での使用ガイドラインを設定

トラブルシューティング

よくある問題と解決法

Agent Modeが有効にならない

症状: 設定を有効にしてもAgent Modeが表示されない 解決法:

  1. VS Codeを最新版にアップデート
  2. GitHub Copilot拡張機能を再インストール
  3. VS Codeを再起動
  4. GitHub Copilotのサブスクリプションを確認

AIの提案が期待と違う

症状: 想定していない変更を提案される 解決法:

  1. より具体的で明確な指示を出す
  2. 段階的に小さなタスクに分割
  3. 既存のコード構造を事前に説明
  4. 期待する技術スタックを明示

実行が途中で停止する

症状: 作業が途中で止まってしまう 解決法:

  1. ネットワーク接続を確認
  2. GitHub Copilotの認証状態をチェック
  3. VS Codeのメモリ使用量を確認
  4. 大きなタスクをより小さく分割

パフォーマンスの最適化

効率的な指示の出し方

良い例:

TypeScriptでTodoアプリを作成。
- React + TypeScript使用
- 状態管理はuseStateで
- ローカルストレージに保存
- CSSはTailwind使用
- 追加・削除・完了機能
- テストはJest + React Testing Library

改善が必要な例:

Todoアプリを作って

実践的な活用例

開発フローでの活用

朝の作業開始時

昨日のコードレビューで指摘された箇所を修正して、
- ESLintエラーの解消
- テストカバレッジの向上
- TypeScriptの型安全性強化
- ドキュメントの更新

新機能開発時

ユーザー認証機能を追加。
- JWT トークンベース
- ログイン・ログアウト・サインアップ
- パスワードリセット機能
- セキュリティ要件準拠
- E2Eテスト含む

リリース前チェック

本番リリース前の最終チェック。
- セキュリティ脆弱性スキャン
- パフォーマンステスト実行
- デッドコード除去
- ドキュメント更新
- 設定ファイル最適化

まとめ

VS Code Agent Modeは、AIがファイル編集からコマンド実行、修正まで自動化してくれる革新的な機能です。

主要なポイント

有効化方法:

  • chat.agent.enabledをオンに設定
  • ChatビューでAgentモードを選択

得意分野:

  • 複雑な機能追加やリファクタリング
  • 複数ファイルにまたがる修正
  • テストやlintも含めた自動修正

使い分けのコツ:

  • 大規模タスクはAgent Mode
  • 軽い修正は通常のEdit Mode
  • 明確で具体的な指示を心がける

コメント

タイトルとURLをコピーしました