4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

VS Code Insider版の設定から MCPサーバーを追加して GitHub Copilot agent mode で利用してみる

Last updated at Posted at 2025-04-01

【追記】 March 2025 (version 1.99) のアップデートで、Insider版でなくても Agent mode や MCPサーバーを扱う機能が使えるようになりました

image.png

はじめに

↓このポストに書いていた話に関する内容です。

最初に「VS Code Insider版の設定から MCPサーバーの設定を追加できる」という情報を見かけたのは、上記で引用しているポストでした。

また、検索をしてみると日本語や英語の記事も書かれているようでした。
以下は、その一例です。

●Visual Studio Code + Model Context Protocol (MCP) Servers - the first look - DEV Community
 https://dev.to/thangchung/visual-studio-code-model-context-protocol-mcp-servers-the-first-look-18nb

2025-04-02_01-09-25.jpg

余談: MCP を軽く試した時の記事

余談ですが MCP は以前、しばらく積みネタにした後に、以下の記事に書いた Claude for Desktop で利用するという内容から着手したことがあるものです。

●今になって Claude for Desktop で MCP に入門してみた(Claude は Free plan) - Qiita
 https://qiita.com/youtoy/items/3ef0af28b530f5c5709c

試してみる

実際に試してみます。

MCP関連の設定を開く

MCP関連の設定を開きます。

経路は複数あるみたいですが、自分は左下のアイコンから設定を開き、たどっていきました。

image.png

設定を開いたら「mcp」というキーワードで検索します。
そうすると、以下のように 3つの関連項目が出てきます。

image.png

その一番上の以下にある項目で、「setting.json で編集」の部分をクリックします。

image.png

setting.json での該当項目

そうすると、以下の設定が出てきました。

image.png

デフォルトで書かれている内容は以下のとおりです。

{
    "mcp": {
    
        "inputs": [],
        "servers": {
            "mcp-server-time": {
                "command": "python",
                "args": [
                    "-m",
                    "mcp_server_time",
                    "--local-timezone=America/Los_Angeles"
                ],
                "env": {}
            }
        }
    }
}

setting.json の内容を決める

デフォルトで書かれている内容を、今回のお試し用の内容に変更してみます。

具体的には、冒頭で紹介していた英語の記事の、以下の部分をもとにしてみます。

image.png

それを、前に Claude for Desktop で試した内容(自分の過去のお試しの内容)の情報と合わせるような形です。

image.png

setting.json の内容の書きかえ

具体的には、以下のような内容にしました。

image.png

前に Claude for Desktop で試した時の設定とは、少しだけ書式が違っていたりします。

{
    "mcp": {
        "servers": {
            "filesystem": {
                "command": "npx",
                "args": [
                    "-y",
                    "@modelcontextprotocol/server-filesystem",
                    "/Users/【Macでのユーザー名】/Downloads/temp"
                ],
            }
        }
    }
}

この VS Code Insider版での設定と合わせて、上記設定に記載したパスに該当するフォルダを作っています。

MCPサーバーの起動

その後、以下から MCPサーバーを起動します。

image.png

GitHub Copilot agent mode から試す

現状、VS Code Insider版でプレビュー版で提供されている「GitHub Copilot agent mode」から試してみます。

image.png

VS Code Insider版で GitHub Copilot のチャットを開き、そしてメニューを変更してエージェントに切り替えます。

image.png

まずは「フォルダのパスは?」と雑に聞いてみました。

そうすると、前に Claude for Desktop で試した時と同様に、アクセス権・実行権限の設定に関する操作を求められました。

image.png

それを許可した後に(※ 上の画像は許可した後の状態)、フォルダの情報が出てきましたが、表示的に分かりにくいものになってしまいましたw

次に「GitHub Copilot agent mode の概要を、tempフォルダ内にテキストファイルで保存して。」という内容を試しました。

また、アクセス権・実行権限の設定に関する操作を求められ、それを許可すると以下のようにファイルを作成したという返答が返ってきました。

image.png

今回、MCPサーバーの設定で書いていたフォルダを Finder で開くと、以下のようにテキストファイルが作成されているのが確認できました。

image.png

ちなみに、テキストの中身は以下の通りでした。

image.png

おわりに

「VS Code Insider版の設定で MCPサーバーを追加し、さらに GitHub Copilot agent mode でそれを利用してみる」という内容が、意図通りに行えたのを確認できました。

4
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?