Claude DesktopでGitHub連携してみた！WSL上でPerplexityとGitHubのMCPサーバーを両立する方法

## はじめに
  
本記事では、

- Claude Desktop (ローカル版のClaudeクライアント)
- WSL(Ubuntu) 上で Perplexity-ask と GitHub MCPサーバー
- `claude_desktop_config.json` の設定

を組み合わせて、**GitHubリポジトリの作成・ファイル更新・Issue作成などを自然言語で行える**ようにするまでの手順を紹介します。

> **対象読者**  
> - Claude Desktop を既に導入している方  
> - MCP (Model Context Protocol) サーバーをローカルで起動して連携させたい方  
> - Perplexity 連携はできたけど、さらに GitHub 連携も試してみたい方  

---

## ゴール

1. **WSL上で** Perplexity‐ask MCPサーバー と GitHub MCPサーバー を起動し、  
2. **Claude Desktop** から両方にアクセスできるようにする  
3. GitHubリポジトリの作成やファイル更新を「会話だけで完結」させる
以下の様にGitHub PagesとGithub Actionsで動的なページをチャットしながらすぐに作ってくれました。既存のサービスでなく、少しでも自分の手が加わった物で作ってくれてると、より実感がわきますｗ

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3976506/9d8a900e-bd0d-44a1-84df-98e988a01de4.png)

---

## 1. Claude Desktop & MCP とは？

- **Claude Desktop**: Anthropic社のLLM「Claude」をローカルで使うためのデスクトップクライアント。  
- **MCP (Model Context Protocol)**: ClaudeなどのAIモデルに外部ツールへのアクセスを付与するためのプロトコル。  
  - たとえば Perplexity‐ask MCPサーバーを連携すると、Claudeからウェブ検索ができる  
  - GitHub MCPサーバーを連携すると、ClaudeからGitHub APIを叩いてファイル作成・Issue作成などができる

---

## 2. 環境概要

- **OS**: Windows 10 / 11  
- **WSL**: Ubuntu 22.04 (例)  
- **Claude Desktop**: 1.**x**  
- **Node.js**: 22.14.0 (nvm管理)  
- **Perplexity-ask**: MCPサーバー for Perplexity  
- **GitHub MCP Server**: MCPサーバー for GitHub

---

## 3. Perplexity-ask MCPサーバーの設定 (おさらい)

もし既にPerplexity連携済みなら、このステップはスキップOK。  
ここでは例として `~/modelcontextprotocol/perplexity-ask` にソースをクローン＆ビルドし、WSL上で `node dist/index.js` を起動する形にしています。

```bash
cd ~
git clone https://github.com/ppl-ai/modelcontextprotocol.git
cd modelcontextprotocol/perplexity-ask
npm install
npm run build
```

### Claude Desktopの設定例

```jsonc
{
  "mcpServers": {
    "perplexity-ask": {
      "command": "wsl",
      "args": [
        "bash",
        "-c",
        "export PERPLEXITY_API_KEY='pplx-xxxxxxxx'; /root/.nvm/versions/node/v22.14.0/bin/node /root/modelcontextprotocol/perplexity-ask/dist/index.js"
      ]
    }
  }
}
```

> **ポイント**: `-c "..."` の中で環境変数をエクスポートし、Node.jsを起動しています。  
> WSL内で `bash` を使っているため、Windowsから見ると「止まっている」ように見えますが、実際はサーバープロセスとして待機中です。

---

## 4. GitHub MCPサーバーを追加

### 4.1 GitHub Personal Access Tokenを用意

- GitHubの「Settings > Developer settings > Personal access tokens」から、  
  `repo` 権限付きのTokenを発行  
- `ghp_xxx...` のような文字列をコピーしておく

### 4.2 ソースクローン & ビルド (npxを使う場合は不要)

Dockerを使わず、ローカルビルド＆Node実行したい場合は以下。

```bash
cd ~
git clone https://github.com/modelcontextprotocol/servers.git
cd servers/src/github
npm install
npm run build
```

### 4.3 Claude Desktopの設定に追記

`claude_desktop_config.json` で、先ほどの `perplexity-ask` と同じ `mcpServers` ブロックに `github` を追加します。  
以下はローカルビルド済みの `dist/index.js` を呼び出す例です。

```jsonc
{
  "mcpServers": {
    "perplexity-ask": {
      "command": "wsl",
      "args": [
        "bash",
        "-c",
        "export PERPLEXITY_API_KEY='pplx-xxxxxxxx'; /root/bin/node /root/modelcontextprotocol/perplexity-ask/dist/index.js"
      ]
    },
    "github": {
      "command": "wsl",
      "args": [
        "bash",
        "-c",
        "export GITHUB_PERSONAL_ACCESS_TOKEN='ghp_xxx'; /root/bin/node /root/servers/src/github/dist/index.js"
      ]
    }
  }
}
```

> **注**: `-c` の中で `export GITHUB_PERSONAL_ACCESS_TOKEN='...'` をセットし、Node.jsで `dist/index.js` を起動。

### 4.4 Claude Desktopの再起動

- 設定ファイルを保存し、Claude Desktopを再起動  
- 右上のハンマーアイコンをクリックして、`perplexity-ask` と `github` の2つが表示されているか確認

---

## 5. 実際に試してみる

### 5.1 リポジトリを作成する

Claudeにチャットで:

> 私のGitHubアカウントで `test-mcp` というプライベートリポジトリを作ってください。  
> 説明は「MCP test repo」でお願いします。

Claudeが `create_repository` ツールを呼び出し、GitHubにリポジトリを作成します。  
完了するとClaudeから「リポジトリを作成しました」というレスポンスが返ってくるはず。  
GitHub Web UIで `test-mcp` ができているか確認します。

### 5.2 ファイルをプッシュ

> リポジトリ `test-mcp` の `main` ブランチに `README.md` を作成して、  
> 内容は「# Hello from Claude」  
> コミットメッセージは「Add README」です。

Claudeが `create_or_update_file` もしくは `push_files` ツールを呼び出し、GitHub上にファイルを作成してくれます。  
終わったら実際にGitHubで `README.md` が追加されているかチェック。

### 5.3 Issueを作る

> Claude、`test-mcp` にIssueを作成してください。  
> タイトル: 「動作確認用Issue」  
> 本文: 「動作確認テストとしてのIssueです」  
> ラベル: `documentation`

Claudeが `create_issue` ツールを呼び出し、Issueが作成されます。

---

## 6. トラブルシューティング

1. **`npx: command not found`**  
   - `bash -c` では `.bashrc` や `.profile` が読み込まれず、nvm設定が反映されていない可能性があります。  
   - `bash -i -c` や PATHを明示的に指定、もしくは Node.js をフルパスで呼び出す方法で解決します。

2. **`Not Found: Resource not found`**  
   - Claudeが単一ファイル更新 (`create_or_update_file`) を呼び出したがブランチが存在しない、などの理由で失敗している可能性があります。  
   - その後 `push_files` が成功してファイル自体は作られているケースもあるため、実際のGitHub上の状態を確認してください。

3. **`perplexity-ask` と同時に起動しない**  
   - `claude_desktop_config.json` の JSONフォーマットが崩れていないか（コメント行やカンマ抜けなど）をチェック  
   - どちらも同じ `mcpServers` オブジェクトに入れる必要があります。

---

## 7. まとめ

- **Claude Desktop** は単なるチャットUIにとどまらず、MCPサーバーを介して様々な外部サービスと連携可能。  
- **WSL上で Node.js サーバーを起動**しておき、`claude_desktop_config.json` で `bash -c "..."` するのが一つのパターン。  
- **Perplexity‐ask と GitHub MCP** を同時に使うと、会話しながら「Web検索で情報収集 → GitHubにコードをプッシュ」といったワークフローを自然言語だけで実現できる。

「AIでGitHub操作がしたい」「自然言語だけでリポジトリ管理をしてみたい」という方は、ぜひ試してみてください。  

---

### 参考リンク

- [Claude Desktop 公式](https://github.com/ppl-ai/claude-desktop)  
- [Model Context Protocol (MCP) 公式](https://modelcontextprotocol.io/)  
- [Perplexity-ask リポジトリ](https://github.com/ppl-ai/modelcontextprotocol/tree/main/perplexity-ask)  
- [GitHub MCP Server リポジトリ](https://github.com/modelcontextprotocol/servers/tree/main/src/github)