0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

@rino_yume(rino yume)

WSLでClaude Code + context-modeを使う：MCPプラグインでAIコーディングを効率化する

0
Posted at

WSLでClaude Code + context-modeを使う：MCPプラグインでAIコーディングを効率化する

1. はじめに

AIコーディングエージェントを使って開発していると、次のような問題が起きやすいです。

問題点

  • ソースコード全体を読ませると、コンテキストを大量に消費する
  • 長いログやビルド結果でTokenを浪費する
  • 会話が長くなると、AIが作業の前提を忘れやすい
  • PyInstaller、pytest、FastAPI、GUIアプリなどのログ解析が重い
  • 大規模プロジェクトでは「どのファイルを直していたか」が曖昧になりやすい

そこで、WSL上で Claude Code + context-mode を組み合わせ、context-modeを MCPプラグイン として使う構成を整理します。

context-modeは、AIに巨大なファイルやログをそのまま読ませるのではなく、必要な情報だけを検索・要約して渡すための仕組みです。

ここでは、WSL上でClaude Codeとcontext-modeを使う場合の考え方、導入方法、処理方法、運用方法、注意点を簡潔にまとめます。

私はAIのプロではありませんので、間違った情報もあるかもしれません。
あくまでも参考資料として読んでくださいね。

2. context-modeとは

context-modeは、AIコーディングエージェント向けの コンテキスト節約用MCPサーバー／プラグイン です。

AIに巨大なログやファイルをそのまま読ませるのではなく、ローカル側で次のような処理を行い、必要な情報だけをAIへ渡します。

  • ファイルやディレクトリの索引化
  • ログやソースコードの検索
  • コマンド実行結果の要約
  • 大きな出力のコンテキスト流入抑制
  • セッション情報の保持補助

つまり、context-modeは次の考え方で使います。

AIに全部読ませない
↓
context-modeで索引化・検索・要約する
↓
必要な情報だけClaude Codeへ渡す

特に、Python GUIアプリ、FastAPI、OpenLayers、DuckDB、PyInstallerなど、複数ファイルを何度も修正する開発では便利です。

3. MCPとは

MCPは Model Context Protocol の略です。

AIエージェントから外部ツール、ファイル、データベース、検索、ローカルコマンドなどを呼び出すための共通的な仕組みです。

Claude Codeでは、MCPサーバーを登録することで、Claudeから外部ツールを呼び出せるようになります。

context-modeは、このMCPサーバーとして動作します。

4. なぜWSL上で使うのか

Windows + WSL環境では、PowerShell側とWSL側で実行環境が分かれます。

Claude CodeをWindows側で起動し、context-modeをWSL側に入れると、PATHやファイルパスの違いにより、うまく動かないことがあります。

そのため、この記事では次の方針にします。

Claude Code   → WSL側で起動
context-mode  → WSL側で利用
Node.js/npm   → WSL側に入れる
設定ファイル  → WSL側の ~/.claude またはプロジェクト配下に置く
作業場所      → できるだけ WSL側の ~/projects 配下

WSL上で完結させることで、パスや実行環境のズレを減らせます。

5. 全体構成

Windows 11
  └─ WSL2 / Ubuntu
       ├─ Node.js / npm
       ├─ Claude Code
       ├─ context-mode
       │    ├─ ctx_index
       │    ├─ ctx_search
       │    ├─ ctx_execute
       │    ├─ ctx_stats
       │    └─ ctx_doctor
       │
       └─ 開発プロジェクト
            ├─ src/
            ├─ tests/
            ├─ logs/
            ├─ CLAUDE.md
            ├─ .claude/
            └─ .mcp.json

Claude Codeでは、プロジェクト用の指示は CLAUDE.md、MCP設定は .mcp.json や ~/.claude.json、Claude Codeの設定は ~/.claude/settings.json などで管理します。

6. 前提環境

この記事では以下を想定します。

Windows 11
WSL2
Ubuntu 24.04系
Claude Code
Node.js 22系以上
context-mode

6.1. WSL側の基本パッケージを入れる

WSLのUbuntuを開き、基本パッケージを入れます。

sudo apt update
sudo apt install -y git curl build-essential ca-certificates gnupg

6.2. Node.jsを入れる

context-modeを npx や npm 経由で使う場合に備えて、WSL側にNode.jsを入れます。

ここではnvmを使います。

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash
source ~/.bashrc

LTS版を入れます。

nvm install --lts
nvm use --lts

確認します。

node -v
npm -v

6.3. Claude Codeを入れる

WSL / Ubuntuでは、aptで入れる方法が分かりやすいです。

sudo install -d -m 0755 /etc/apt/keyrings

sudo curl -fsSL https://downloads.claude.ai/keys/claude-code.asc \
  -o /etc/apt/keyrings/claude-code.asc

echo "deb [signed-by=/etc/apt/keyrings/claude-code.asc] https://downloads.claude.ai/claude-code/apt/stable stable main" \
  | sudo tee /etc/apt/sources.list.d/claude-code.list

sudo apt update
sudo apt install claude-code

確認します。

claude --version

起動します。

claude

初回起動時は、Claudeアカウントでログインします。

npmで入れる場合

npmで入れる場合は以下です。

npm install -g @anthropic-ai/claude-code

ただし、公式ドキュメントでは sudo npm install -g は避けるように説明されています。
権限エラーを避けるため、nvm環境で実行するのが無難です。

6.4. context-modeをClaude Code pluginとして入れる

Claude Codeの中で、plugin marketplaceを追加します。

/plugin marketplace add mksglu/context-mode

続けて、context-modeをインストールします。

/plugin install context-mode@context-mode

Claude Codeを再起動するか、以下を実行します。

/reload-plugins

確認します。

/context-mode:ctx-doctor

すべてのチェックがOKになれば、Claude Codeからcontext-modeを使える状態です。

6.5. MCPのみで試す場合

plugin方式ではなく、まずMCPサーバーとしてだけ試すこともできます。

claude mcp add context-mode -- npx -y context-mode

確認します。

claude mcp list

Claude Code内では以下でも確認できます。

/mcp

ただし、MCPのみの登録では、自動的なhookやslash command連携は弱くなります。
本格的に使うなら、plugin方式の方が分かりやすいです。

6.6. CLAUDE.mdを配置する

Claude Codeに作業方針を伝えるため、プロジェクトルートに CLAUDE.md を置きます。

cd ~/projects/my_app
nano CLAUDE.md

例です。

# CLAUDE.md

## 作業方針

- 巨大なログやソース全文を直接読まない
- まず context-mode の ctx_index / ctx_search を使う
- 関係するファイルだけを確認してから修正する
- 実行ログは要約して原因を整理する
- 修正前に変更方針を説明する
- 修正後はテストまたは起動確認を行う

## 開発環境

- Python GUIは PySide6 + pyqtgraph を優先する
- Web地図は OpenLayers を使う
- APIは FastAPI を使う
- DBや空間データ処理では DuckDB / DuckDB Spatial を使う
- Windows向けbatは Shift_JIS(cp932) + CRLF で保存する
- ソースコードには日本語コメントとdocstringを入れる

毎回同じ方針で作業させたい場合は、プロジェクトごとに CLAUDE.md を置くのがおすすめです。

6.7. 基本的な使い方

作業対象のプロジェクトへ移動します。

cd ~/projects/my_app
claude

Claude Code内で、まず状態を確認します。

/context-mode:ctx-doctor
/context-mode:ctx-stats

ソースを索引化します。

/context-mode:ctx-index src

プロジェクト全体を対象にする場合は以下です。

/context-mode:ctx-index .

特定の処理を検索します。

/context-mode:ctx-search PySide6 3D表示
/context-mode:ctx-search PyInstaller error
/context-mode:ctx-search FastAPI DuckDB endpoint

ログを解析したい場合は、ログフォルダを索引化します。

/context-mode:ctx-index logs
/context-mode:ctx-search Traceback

6.8. Claude Codeへの依頼例

最初に次のように依頼すると使いやすいです。

このプロジェクトではcontext-modeを使ってください。
巨大なログやソース全文を直接読むのではなく、
ctx_index、ctx_search、ctx_execute を優先してください。
まずsrcを索引化し、関係するファイルだけを調査してください。

修正依頼の例です。

srcをctx_indexで索引化してから、
3D表示に関係する処理をctx_searchで調べてください。
その後、必要なファイルだけを確認して修正方針を提案してください。

ログ解析の例です。

logsをctx_indexして、TracebackとModuleNotFoundErrorを検索してください。
原因を整理して、修正すべきファイルと修正案を出してください。

6.9. 運用方法

作業開始時

1. WSLターミナルを開く
2. プロジェクトへ移動
3. claudeを起動
4. /context-mode:ctx-doctor で確認
5. srcやlogsをctx_index

調査時

全文を読ませる前にctx_searchする
ログを貼る前にlogsをctx_indexする
大きなJSONやCSVはctx_executeで集計する

修正時

関係ファイルだけを読ませる
修正前に変更方針を確認する
修正後にテストまたは起動確認を行う
テスト結果はcontext-modeで要約する

定期的に確認するもの

/context-mode:ctx-stats
/context-mode:ctx-doctor

9.10. 実務での使いどころ

特に効果が出やすいのは、次のような場面です。
これは、私の開発環境と開発アプリの使い方ですので、それぞれ￥開発する物によると思います。

場面 context-modeの使い方
PySide6 GUIアプリの調査 ctx_index src して関係箇所だけ検索
PyInstallerエラー解析 ctx_index logs してTracebackを検索
FastAPI + DuckDB構成確認 API、DB、ルーティング関連を検索
OpenLayersの表示不具合 frontend関連ファイルを索引化して検索
pytest結果の確認 長いログを直接貼らず要約
大量JSON/CSVの確認 ctx_execute で集計して結果だけ見る

6.11. 注意点

PowerShell側から起動しない

WSLで使う場合は、PowerShellではなくWSLターミナルからClaude Codeを起動します。

claude

PowerShell側で起動すると、Windows側のPATHや設定を使ってしまい、WSL側のcontext-modeと噛み合わないことがあります。

WindowsパスとLinuxパスを混ぜない

WSLでは、なるべくLinux側のホーム配下で作業するのがおすすめです。

~/projects/my_app

Windows側のファイルを直接扱う場合は、次のようになります。

/mnt/c/WinPython/...

ただし、/mnt/c 配下はファイルI/Oが遅くなる場合があります。
可能であれば、開発作業はWSL側のホーム配下に置くと安定します。

秘密情報を読ませない

.env、APIキー、認証情報、顧客データなどは、AIやMCPツールに不用意に読ませないようにします。

必要に応じて .claude/settings.json で読み取りを制限します。

{
  "permissions": {
    "deny": [
      "Read(./.env)",
      "Read(./.env.*)",
      "Read(./secrets/**)",
      "Read(./config/credentials.json)"
    ]
  }
}

context-modeは万能ではない

context-modeは、AIの代わりに自動で全部直してくれるツールではありません。

あくまでも、

巨大な情報を整理する
必要な情報だけ検索する
コンテキスト消費を減らす

ための補助ツールです。

最終的な判断は人間側で行う必要があります。

6.12. トラブルシュート

pluginコマンドが使えない

Claude Codeが古い可能性があります。

claude --version

更新してから再確認します。

context-modeが認識されない

MCPの状態を確認します。

/mcp

または、plugin方式なら以下を確認します。

/context-mode:ctx-doctor

Node.js / npm が見つからない

WSL側で確認します。

which node
which npm
node -v
npm -v

nvmを使っている場合は、.bashrc が読み込まれているか確認します。

source ~/.bashrc

設定を変更したのに反映されない

Claude Codeを再起動します。

/exit

その後、再度起動します。

claude

pluginを再読み込みする場合は以下です。

/reload-plugins

7. まとめ

WSL上で Claude Code + context-mode を使うと、AIコーディング時のコンテキスト消費を抑えながら、ソース調査やログ解析を進めやすくなります。

特に、次のような開発では効果が大きいと思います。

Claude Code + context-mode を使うポイント

  • Python GUIアプリ
  • FastAPI + DuckDBアプリ
  • OpenLayersを使ったWeb GIS
  • PyInstallerのビルドエラー解析
  • 大量ログの原因調査
  • 複数ファイルをまたぐリファクタリング

大切なのは、AIに全部読ませるのではなく、必要な情報だけを渡すことです。

全文投入
↓
検索・要約・必要箇所だけ確認

この流れにすることで、Claude Codeをより安定して使いやすくなると思います。

今回は、WSL上でClaude Codeとcontext-modeを組み合わせ、MCPプラグインとしてAIコーディングを効率化する方法を整理しました。

今後、Claude Codeやcontext-modeの仕様は変わる可能性があります。
実際に使う場合は、公式ドキュメントやGitHubの最新情報も確認しながら進めるのが良いと思います。

8. 参考リンク

0
0
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
Sign upLogin
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?