Cline 連携

VS Code で Cline 拡張機能を使って QCode.cc API を利用する

Cline 連携¶

Cline は VS Code 向けの AI プログラミング拡張機能（数百万インストール）で、任意の AI モデルやカスタム API エンドポイントに対応しています。Plan / Act の 2 モード、ファイル編集の diff プレビュー、ターミナル実行、MCP ツール呼び出しを標準搭載しています。Cline と QCode.cc API を組み合わせることで、VS Code 内で低コストに Claude や GPT などのモデルを利用できます。

Cline を選ぶ理由¶

• ゼロマークアップ：モデル料金への上乗せなし、QCode.cc API の料金のみ

• マルチモデル切り替え：同じインターフェースで claude-opus-4-8、claude-sonnet-4-6、gpt-5.x などを切り替え可能

• VS Code との深い統合：サイドバーパネル、インラインコード操作、ファイル編集の diff プレビュー、自動承認

• Plan / Act の 2 モード：先に計画してから実行 — 複雑な変更も制御しやすい

• 完全オープンソース：コードが透明で、コミュニティが活発

• MCP 対応：Model Context Protocol で外部ツール（DB、ブラウザ、ドキュメント）に接続

インストールと設定¶

ステップ 1：Cline 拡張機能のインストール¶

VS Code で：

1. 拡張機能パネルを開く（Ctrl+Shift+X / Cmd+Shift+X）

2. 「Cline」 を検索

3. インストール をクリック

4. インストール後、左側のアクティビティバーに Cline アイコンが表示されます

Cline にはコマンドライン版（Cline CLI）もあり、同じ設定をターミナルで再利用できます。本ガイドでは VS Code 拡張機能を中心に説明します。

ステップ 2：QCode.cc API の設定¶

QCode.cc の API キー（cr_ で始まる）1 本で、Anthropic プロトコルと OpenAI プロトコルの両方に対応します。Cline には 2 通りの接続方法があり、どちらか一方を選べば OK です：

方法 A：Anthropic 互換（Claude モデルに推奨）¶

Cline の設定（歯車アイコン）の API Provider ドロップダウンで 「Anthropic」 を選択し、以下を入力します：

SDK は Base URL の後ろに自動で /v1/messages を追加します。そのため Base URL は /api までで止め、/api/v1/messages と書かないでください。末尾のスラッシュも付けないでください。

方法 B：OpenAI 互換¶

API Provider ドロップダウンで 「OpenAI Compatible」 を選択し、以下を入力します：

OpenAI 互換モードは /chat/completions エンドポイントを使い、Claude と GPT の全ラインナップに同じ画面からアクセスできます。

ステップ 3：接続の確認¶

Cline のチャットボックスに簡単なメッセージ（例：「Hello」）を入力し、返答があれば設定完了です。

ターミナルで curl を使って自己確認することもできます（401 が返れば、パスは正しく認証情報だけが欠けている状態です）：

# Anthropic プロトコル
curl -i https://api.qcode.cc/api/v1/messages \
  -H "content-type: application/json" \
  -d '{"model":"claude-sonnet-4-6","max_tokens":16,"messages":[{"role":"user","content":"hi"}]}'

# OpenAI プロトコル
curl -i https://api.qcode.cc/openai/v1/chat/completions \
  -H "content-type: application/json" \
  -d '{"model":"claude-sonnet-4-6","messages":[{"role":"user","content":"hi"}]}'

バックアップノード¶

同じキーは 4 つのアクセスドメインで利用でき、互いにバックアップになります。メインドメインが不安定な場合は、Base URL の api を下表の対応サブドメインに置き換えてください：

中国本土のユーザーは asia.qcode.cc を優先すると、通常もっとも低遅延です。詳細は 接続点と API フォーマット を参照してください。

Plan / Act の 2 モード¶

Cline はチャットボックスの下に Plan / Act の切り替えを備えています：

• Plan（計画）：Cline はコードを読み、質問し、実装方針を提案しますが、ファイルは変更しません。着手前に要件をすり合わせるのに最適です。

• Act（実行）：Cline が実際にファイルの作成・編集、コマンド実行、ツール呼び出しを行います。各変更は diff で表示され、承認または自動承認できます。

典型的なワークフロー：まず Plan モードで方針を整理・確認させ、次に Act モードに切り替えて段階的に実装します。複雑なタスクでは、推論力の高い claude-opus-4-8 で計画し、コスパに優れる claude-sonnet-4-6 で実行するのがおすすめです。

使い方のヒント¶

1. モデル選択のおすすめ¶

価格の詳細は 課金について を参照してください。

2. MCP ツールの設定¶

Cline は Model Context Protocol（MCP）に対応しており、モデルから外部ツール（DB クエリ、ブラウザ、ドキュメント検索など）を呼び出せます。Cline の MCP Servers パネルでサーバーを追加します：

{
  "mcpServers": {
    "filesystem": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-filesystem", "/path/to/project"]
    }
  }
}

MCP サーバーは上流モデルから分離されており、QCode.cc に Anthropic / OpenAI のどちらのプロトコルで接続してもツール呼び出しは正常に動作します。各サーバーのインストール手順やパラメータは、そのツールの公式ドキュメントを参照してください。

3. プロジェクト単位のカスタム指示（.clinerules）¶

プロジェクトのルートに .clinerules ファイルを作成すると、そのリポジトリ固有のコンテキスト（コードスタイル、技術スタックの規約、ディレクトリ構成など）を固定で注入できます。Cline は毎回の会話でこれらのルールを含めるため、繰り返し貼り付ける必要がありません：

# .clinerules

- 全体で TypeScript（strict モード）を使用
- src/lib 配下のユーティリティを優先的に再利用
- コミット前に `pnpm test` を実行

ルールファイルのフィールドや高度な使い方は、Cline の公式ドキュメントを参照してください。

4. 画像入力（画像の読み取り）¶

claude-opus-4-8、claude-sonnet-4-6、GPT-5.x はいずれも画像入力（ビジョン）に対応しています。UI のスクリーンショット、エラー画面、アーキテクチャ図を Cline のチャットボックスに直接ドラッグして、画像をもとにコーディングやデバッグをさせられます。

注意：ここで言うのはモデルに画像を読み取らせることです。画像を生成したい場合は、gpt-image-2 画像生成（モデル名 gpt-image-2）を使用してください。

5. 自動承認とコスト管理¶

• 設定では「ファイル読み取り」「ファイル書き込み」「コマンド実行」ごとに Auto-approve を有効化でき、中断を減らせます。リスクの高い操作には手動確認を残すのがおすすめです。

• Cline はリクエストごとのトークン使用量と推定費用を表示するため、支出を把握しやすくなります。複雑なタスクは Plan モードで範囲を絞ると、無駄なやり取りを避けられます。

• 大規模なコードベースでは、モデルにプロジェクト全体を読ませるのではなく、@（ファイル/フォルダ/URL の指定）で正確なコンテキストを与えると、トークンを節約でき、より焦点が絞られます。

6. Claude Code CLI との併用¶

Cline と Claude Code CLI にはそれぞれ強みがあり、併用をおすすめします：

7. 共有クォータ¶

Cline と Claude Code CLI は同じ QCode.cc API キーを使用し、プランのクォータを共有します。ツールごとに別のキーを申請する必要はありません。

よくある質問¶

接続に失敗する / 401 / 404 の場合¶

1. Base URL の末尾に余分な / がないか確認

2. Anthropic モードでは Base URL を /api までにする（SDK が /v1/messages を補完）。フルパスを手書きしない

3. OpenAI モードでは Base URL を /openai/v1 までにする

4. API キーが cr_ で始まり、完全にコピーされているか確認

5. バックアップノードへの切り替えを試す（例：asia.qcode.cc）

6. ネットワークが QCode.cc サービスにアクセスできるか確認

モデルリストが空の場合¶

OpenAI 互換モードでは、Model ID の入力欄にモデル名（例：claude-sonnet-4-6）を手動で入力してください。リストからの選択は不要です。

Plan モードでファイルが変更されない¶

これは想定どおりの動作です。Plan モードは計画のみで、Act モードに切り替えてから変更が書き込まれます。

設定は正しそうなのに 401 が出る¶

401 は通常、パスは正しく認証だけが失敗している状態を意味します。API Key が完全か、Provider の種類（Anthropic か OpenAI Compatible か）と対応する Base URL を正しく選んでいるか、再確認してください。

次のステップ¶

• 接続点と API フォーマット で全プロトコルとドメインを確認

• Aider 連携 で QCode.cc 対応のもう一つのオープンソースツールを確認

• VS Code 連携 で Claude Code 公式拡張機能を確認

• 課金について で料金の詳細を確認

まだ API キーをお持ちでない場合は？QCode.cc のプランと料金を見る →