VS Code で「Sequential Thinking MCP Server」を使う（GitHub Copilot agent mode で利用）

## はじめに

最近、VS Code・Claude for Desktop から「[modelcontextprotocol/servers/src](https://github.com/modelcontextprotocol/servers/tree/main/src
)」にある MCPサーバーの 1つを試してみたり、[自作のシンプルな MCPサーバーを作って VS Code・Claude for Desktop から呼んでみたり](https://qiita.com/youtoy/items/01f8918b378c51989173)、というのをやってみていました。

### 今回の内容

今回は、以下でもやっていた VS Code ＋ GitHub Copilot agent mode ＋「[modelcontextprotocol/servers/src](https://github.com/modelcontextprotocol/servers/tree/main/src
)」にある MCPサーバーの組み合わせです。

●VS Code の設定から MCPサーバーを追加して GitHub Copilot agent mode で利用してみる（安定版でも利用可能に） - Qiita
　https://qiita.com/youtoy/items/adfeedeedf1309f194ce

上記では、「[Filesystem MCP Server](https://github.com/modelcontextprotocol/servers/tree/main/src/filesystem)」を使っていましたが、今回は以下の「Sequential Thinking MCP Server」を試してみることにしました。

●servers/src/sequentialthinking at main · modelcontextprotocol/servers
　https://github.com/modelcontextprotocol/servers/tree/main/src/sequentialthinking


## さっそく試していく

さっそく試していきます。

### 環境の準備

[前の記事](https://qiita.com/youtoy/items/adfeedeedf1309f194ce)に書いていた、環境の準備を行っておきます。具体的には以下の内容です。

- setting.json に設定を書く
- MCPサーバーを起動する

詳細は、[前の記事の「MCP関連の設定」の部分](https://qiita.com/youtoy/items/adfeedeedf1309f194ce#mcp%E9%96%A2%E9%80%A3%E3%81%AE%E8%A8%AD%E5%AE%9A)をご参照ください。


#### 今回の設定内容

setting.json に書く設定について、少し補足します。

今回の[「Sequential Thinking MCP Server」公式の設定のサンプル（npx を使う場合）](https://github.com/modelcontextprotocol/servers/tree/main/src/sequentialthinking#npx)は、以下のとおりです。

```json
{
  "mcpServers": {
    "sequential-thinking": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-sequential-thinking"
      ]
    }
  }
}
```

今回は VS Code で使うので、冒頭部分の記載内容が少しだけ変わります。

```json
{
  "mcp": {
    "servers": {
      "sequential-thinking": {
        "command": "npx",
        "args": ["-y", "@modelcontextprotocol/server-sequential-thinking"]
      }
    }
  }
}
```

これを VS Code に設定して、その後に「Sequential Thinking MCP Server」を起動しました。



### 動作確認1（GPT-4o）

あとは、GitHub Copilot のエージェントモードで、明示的にツールを使う指示をまぜたプロンプトを実行します。モデルは、デフォルトの「GPT-4o」で試しました。

依頼内容は、Sequential Thinking を使うほどのものではない以下の内容で試しました。Sequential Thinking MCP Server を使った処理の単純な動作確認を手っ取り早く行いたかったので、適した依頼内容を思いつく前に思いつきで実行してしまいました。

> 【プロンプト】
sequential-thinking で、p5.jsでグローエフェクトを実現する方法

https://x.com/youtoy/status/1912523890871734771

そして、今回のセッション中では、Sequential Thinking をこちらの許可なく実行できるようにしました。

#### 処理の内容・結果

以下は、処理結果です。

Sequential Thinking は行われたのですが、生成されたコードは普通に依頼を出しても生成してくれそうなコードでしたｗ

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/72dfa245-dd9c-48f7-b78f-653a2ba4431e.png)

上記の 3回目の部分で出力されたコードと、実行結果は以下のとおりです。
（以下は、p5.js Web Editor での実行結果です）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/24784bfc-b2cc-4620-9ec6-2541c0a772af.png)



### 動作確認2（Claude 3.7 Sonnet）

今度は Claude 3.7 Sonnet を選んで、同じプロンプトで試してみました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/593acacc-0801-4fe4-82fa-e81e63011710.png)


#### 処理の内容・結果

今度はステップ数が増えて、途中、コードの出力を含むものが何度か混じる感じでした。以下は、その抜粋です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/2c96936e-f03d-459c-9353-e64938bc3bfd.png)


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/65d70718-af77-4e63-9b88-a7e770e07e21.png)


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/0ae68c65-a495-4b97-a341-9e88ee1c34de.png)

最終的に、以下に書かれた 3種類の実装方法でのコードが出力され、さらにインタラクティブにするための方法が出力されました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/5015c32a-9feb-4bff-bfea-1ce135a68163.png)

ちなみに、コードを実行してみたところ 3つのうち 2つは、きちんとしたグローエフェクトにはなっていないものでした。 ← 1回しか試してないので、偶然そうなっただけ、という可能性もありますが

ひとまず、「先ほどより多くのステップ数をふんで、先ほどより多くのパターンを出力する」という違いのある結果は得ることができました。


## おわりに

VS Code で「Sequential Thinking MCP Server」を、とりあえずの内容で試してみました。

複数ステップの処理が行われることは確認できましたが、依頼内容があまり Sequential Thinking を活かしきれなそうな内容だったので、また別の内容・他のモデルでも試してみられればと思います。

あと、「[modelcontextprotocol/servers/src](https://github.com/modelcontextprotocol/servers/tree/main/src
)」にある MCPサーバーで「[Fetch MCP Server](https://github.com/modelcontextprotocol/servers/tree/main/src/fetch)」など、さらに他のものを試してみたり、複数の MCPサーバーを組み合わせた内容なども試せればと思っています。