249 lines
7 KiB
Markdown
249 lines
7 KiB
Markdown
# Continue VSCode拡張機能統合
|
|
|
|
9RouterをContinue拡張機能と統合し、Visual Studio Codeに直接AIアシスタンスを導入します。
|
|
|
|
## 前提条件
|
|
|
|
- Visual Studio Codeがインストール済み
|
|
- VSCodeマーケットプレイスからContinue拡張機能がインストール済み
|
|
- [ダッシュボード](https://9router.com/dashboard)からの9Router APIキー
|
|
- 9Routerが動作中 (ローカルまたはクラウド)
|
|
|
|
## 設定手順
|
|
|
|
### 1. Continue設定を開く
|
|
|
|
1. VSCodeを開く
|
|
2. `Cmd+Shift+P` (Mac) または `Ctrl+Shift+P` (Windows/Linux) を押す
|
|
3. 「Continue: Open Config」と入力して選択
|
|
4. `~/.continue/config.json` が開きます
|
|
|
|
### 2. 9Routerモデル設定を追加
|
|
|
|
以下の設定を `config.json` に追加:
|
|
|
|
**単一モデルセットアップ:**
|
|
```json
|
|
{
|
|
"models": [
|
|
{
|
|
"title": "9Router - Claude Opus",
|
|
"provider": "openai",
|
|
"model": "cc/claude-opus-4-5-20251101",
|
|
"apiKey": "your-api-key-from-dashboard",
|
|
"apiBase": "http://localhost:20128/v1"
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
**複数モデルセットアップ:**
|
|
```json
|
|
{
|
|
"models": [
|
|
{
|
|
"title": "9Router - Claude Opus (Best)",
|
|
"provider": "openai",
|
|
"model": "cc/claude-opus-4-5-20251101",
|
|
"apiKey": "your-api-key-from-dashboard",
|
|
"apiBase": "http://localhost:20128/v1"
|
|
},
|
|
{
|
|
"title": "9Router - Claude Sonnet (Balanced)",
|
|
"provider": "openai",
|
|
"model": "cc/claude-sonnet-4-20250514",
|
|
"apiKey": "your-api-key-from-dashboard",
|
|
"apiBase": "http://localhost:20128/v1"
|
|
},
|
|
{
|
|
"title": "9Router - DeepSeek Chat (Code)",
|
|
"provider": "openai",
|
|
"model": "cx/deepseek-chat",
|
|
"apiKey": "your-api-key-from-dashboard",
|
|
"apiBase": "http://localhost:20128/v1"
|
|
},
|
|
{
|
|
"title": "9Router - Claude Haiku (Fast)",
|
|
"provider": "openai",
|
|
"model": "cc/claude-haiku-4-20250514",
|
|
"apiKey": "your-api-key-from-dashboard",
|
|
"apiBase": "http://localhost:20128/v1"
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
**クラウド9Router用:**
|
|
`apiBase` を以下に置き換え:
|
|
```json
|
|
"apiBase": "https://9router.com/v1"
|
|
```
|
|
|
|
### 3. 保存してリロード
|
|
|
|
1. 設定ファイルを保存
|
|
2. VSCodeウィンドウをリロード: `Cmd+Shift+P` → 「Developer: Reload Window」
|
|
3. Continue拡張機能が新しい設定を読み込みます
|
|
|
|
### 4. モデルを選択
|
|
|
|
1. Continueサイドバーを開く (左パネルのContinueアイコンをクリック)
|
|
2. 上部のモデルセレクタードロップダウンをクリック
|
|
3. お好みの9Routerモデルを選択
|
|
|
|
## 利用可能なモデル
|
|
|
|
### Claudeモデル (Anthropic)
|
|
- `cc/claude-opus-4-5-20251101` - 最も高性能、複雑なタスクに最適
|
|
- `cc/claude-sonnet-4-20250514` - パフォーマンスと速度のバランス
|
|
- `cc/claude-haiku-4-20250514` - 最速、シンプルなタスクに適している
|
|
|
|
### DeepSeekモデル
|
|
- `cx/deepseek-chat` - コード生成に優れている
|
|
- `cx/deepseek-reasoner` - 複雑な問題解決に最適
|
|
|
|
### GLMモデル (Zhipu AI)
|
|
- `glm/glm-4-plus` - 高度な中国語と英語
|
|
- `glm/glm-4-flash` - 高速応答
|
|
|
|
## 使用例
|
|
|
|
### コード説明
|
|
1. エディタでコードを選択
|
|
2. Continueサイドバーを開く
|
|
3. 入力: 「Explain this code」
|
|
4. Model: `cc/claude-sonnet-4-20250514`
|
|
|
|
### コード生成
|
|
1. Continueサイドバーを開く
|
|
2. 入力: 「Create a React component for user profile card」
|
|
3. Model: `cx/deepseek-chat`
|
|
|
|
### リファクタリング
|
|
1. リファクタリングするコードを選択
|
|
2. 入力: 「Refactor this to use async/await」
|
|
3. Model: `cc/claude-sonnet-4-20250514`
|
|
|
|
### バグ修正
|
|
1. 問題のあるコードを選択
|
|
2. 入力: 「Find and fix the bug in this code」
|
|
3. Model: `cx/deepseek-reasoner`
|
|
|
|
## 高度な設定
|
|
|
|
### カスタムシステムプロンプト
|
|
|
|
特定の動作のためのカスタムシステムプロンプトを追加:
|
|
|
|
```json
|
|
{
|
|
"models": [
|
|
{
|
|
"title": "9Router - Code Expert",
|
|
"provider": "openai",
|
|
"model": "cx/deepseek-chat",
|
|
"apiKey": "your-api-key",
|
|
"apiBase": "http://localhost:20128/v1",
|
|
"systemMessage": "You are an expert programmer. Always provide clean, well-documented code with best practices."
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
### Temperatureとパラメータ
|
|
|
|
パラメータでモデルの動作を調整:
|
|
|
|
```json
|
|
{
|
|
"models": [
|
|
{
|
|
"title": "9Router - Creative Writer",
|
|
"provider": "openai",
|
|
"model": "cc/claude-opus-4-5-20251101",
|
|
"apiKey": "your-api-key",
|
|
"apiBase": "http://localhost:20128/v1",
|
|
"temperature": 0.9,
|
|
"topP": 0.95
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
### コンテキストプロバイダー
|
|
|
|
Continueがモデルに送信するコンテキストを設定:
|
|
|
|
```json
|
|
{
|
|
"contextProviders": [
|
|
{
|
|
"name": "code",
|
|
"params": {
|
|
"maxLines": 100
|
|
}
|
|
},
|
|
{
|
|
"name": "diff",
|
|
"params": {}
|
|
},
|
|
{
|
|
"name": "terminal",
|
|
"params": {}
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
## キーボードショートカット
|
|
|
|
- `Cmd+L` (Mac) / `Ctrl+L` (Windows/Linux) - Continueチャットを開く
|
|
- `Cmd+I` (Mac) / `Ctrl+I` (Windows/Linux) - インライン編集
|
|
- `Cmd+Shift+R` (Mac) / `Ctrl+Shift+R` (Windows/Linux) - 応答を再生成
|
|
|
|
## トラブルシューティング
|
|
|
|
### モデルが応答しない
|
|
- 9Routerが動作中か確認: `curl http://localhost:20128/health`
|
|
- config.jsonのAPIキーを確認
|
|
- エラーについてVSCode開発者コンソールを確認: `Help` → `Toggle Developer Tools`
|
|
|
|
### 間違ったモデルが選択されている
|
|
- Continueサイドバーのモデルドロップダウンをクリック
|
|
- 正しい9Routerモデルを選択
|
|
- モデル名は正確に一致する必要があります (大文字小文字を区別)
|
|
|
|
### 設定が読み込まれない
|
|
- JSON構文が有効であることを確認 (JSONバリデータを使用)
|
|
- ファイルの場所を確認: `~/.continue/config.json`
|
|
- 変更後にVSCodeウィンドウをリロード
|
|
|
|
### パフォーマンスが遅い
|
|
- より高速なモデルへ切替 (haiku、flash)
|
|
- contextProvidersでコンテキストサイズを削減
|
|
- 9Routerへのネットワークレイテンシを確認
|
|
|
|
## ベストプラクティス
|
|
|
|
### モデル選択戦略
|
|
- **クイック編集**: `cc/claude-haiku-4-20250514` を使用
|
|
- **コード生成**: `cx/deepseek-chat` を使用
|
|
- **複雑なリファクタリング**: `cc/claude-opus-4-5-20251101` を使用
|
|
- **問題解決**: `cx/deepseek-reasoner` を使用
|
|
|
|
### コンテキスト管理
|
|
- 質問する前に関連コードのみを選択
|
|
- 具体的で明確なプロンプトを使用
|
|
- 複雑なタスクを小さなステップに分解
|
|
|
|
### コスト最適化
|
|
- シンプルなタスクには高速/安価なモデルを使用
|
|
- 可能な場合はコンテキストサイズを制限
|
|
- 頻繁に使用される応答をキャッシュ
|
|
|
|
## 次のステップ
|
|
|
|
- [Cursorを設定](cursor.md) IDE統合を強化
|
|
- [Rooをセットアップ](roo.md) AIアシスタント用
|
|
- [CLI使用法を確認](../cli/basic-usage.md)
|
|
- [モデル選択について学ぶ](../models/overview.md)
|