Trae 統合

ByteDance の Trae IDE で Claude Code 拡張機能を使用（Trae CN 向けオフラインインストール手順を含む）

API キーが必要ですか？ 登録する →·エンドポイントと Base URL →

最終確認：2026-09-18 · 📄 公式ドキュメント準拠（Trae 3.3.101（2026-09-15 リリース））

概要¶

Trae は ByteDance がリリースした AI ネイティブ IDE で、VS Code から派生した構成です。拡張機能を追加でき、独自の Agent と Chat の両モードも備わっています。2026-05-08 の v3.3.56 で従来の Builder と Builder with MCP は Agent に統合され、公式ドキュメントから Builder の表記は消えました。本ガイドは 2 つを扱います：Trae（国際版）または Trae CN（中国版）への Claude Code 拡張機能の導入、そして内蔵 AI のカスタムモデルとして QCode.cc を追加する方法。

名称について：公式ドキュメントサイト（中日英）はこの IDE を現在 TraeCode と呼んでおり、中国の公式サイトは TraeWork（Work / Code / Design モード切替）を前面に出しています。公式のリネーム発表はなく、changelog のリリース見出しが v3.3.84（2026-08-07）から TraeCode に変わっただけです。本ページのファイル名と URL はそのままです。

前提条件¶

Trae 拡張機能を設定する前に、以下を確認してください：

1. Claude Code CLI がインストールされ、正常に動作している

2. インストールガイド を参照してインストールを完了

3. 環境変数の設定 を参照して設定を完了

4. Trae または Trae CN が最新版にインストール済み

5. 国際版ダウンロード：trae.ai

6. 中国版 Trae CN ダウンロード：trae.com.cn

Trae CN をいつ選ぶ？ 公式ドキュメントに地域別の説明はありません。あるのは「TraeCode の拡張機能マーケットに必要な拡張機能が無い場合、VS Code の拡張機能マーケットのものを TraeCode へ入れられる」という一文だけ。よって下記の「マーケットで見つからない」系の手順はすべて条件付きです：マーケットに見つかるならマーケット、見つからなければ .vsix。

インストール手順¶

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

Claude Code 拡張機能のインストール方法は 2 つあり、順番に試してください。公式の注意書きも引用しておきます：新しい VS Code のインターフェースに依存する拡張機能の特定バージョンは TraeCode と非互換の可能性がある。その場合は Version History から過去版をダウンロードします。

経路 A：Trae 内蔵拡張機能マーケットからインストール（推奨）¶

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

2. "Claude Code" を検索（発行元：Anthropic）

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

Trae の拡張機能マーケットで Claude Code が見つからない場合は経路 B を使ってください（どのバージョンで欠けるかは公式に記載がないため、ここでは断定しません）。

経路 B：オフライン .vsix によるローカルインストール¶

マーケットに目的の拡張機能が無い場合に使う経路です：

1. ブラウザで Claude Code 拡張機能ページ を開く

2. あなたのプラットフォームとアーキテクチャに一致する .vsix をダウンロードします。Trae 公式文書の手順は、拡張機能詳細ページで Version History を開き、itemName と version を使ってダウンロード URL を組み立てるというものです：

text https://marketplace.visualstudio.com/_apis/public/gallery/publishers/<publisher>/vsextensions/<extension>/<version>/vspackage

Claude Code なら publishers/anthropic/vsextensions/claude-code/<version>/vspackage です。 🔴 アーキテクチャを必ず合わせてください：Claude Code はプラットフォーム別に公開されています（ファイル名に @win32-x64 や @alpine-arm64 のようなサフィックスが付く）。公式文書も「アーキテクチャを区別する拡張機能は、自分が使う環境用の VSIX を自分でダウンロードする必要がある」と明記しています。間違うとインストール自体は通っても動きません。macOS は Apple Silicon / Intel、Linux と Windows は x64 / arm64 に分かれます。

または、拡張機能ページの右サイドバーに Download Extension リンクが表示されていれば、そこから取得してください。

ヒント：中国本土から VS Code Marketplace にアクセスするにはプロキシが必要な場合があります。ローカルでダウンロードに失敗した場合は、安定した国際回線のある環境で .vsix をダウンロードし、対象マシンにコピーしてください。

1. Trae で拡張機能パネルを開く → 右上の ⋯ メニュー → VSIX からインストール（Install from VSIX）を選択し、ダウンロードした .vsix ファイルを選択

公式文書にもう一つ手順があります：ダウンロードした .vsix を拡張機能パネルにそのままドラッグすると、Trae が自動的に導入を開始します。 環境によっては trae という起動コマンドが存在しますが、Trae の公式文書に拡張機能を入れるための旗標の記載はなく、当社でも未検証のため、このページではコマンドを载せません。

ステップ 2：primaryApiKey の設定¶

これは重要なステップです！Claude Code 拡張機能は設定ファイルに primaryApiKey を必要とします。

朗報：Trae は VS Code と同じ設定パス（~/.claude/config.json）を共有しているため、VS Code で既に設定済みのユーザーは再度設定する必要はありません。

{
  "primaryApiKey": "qcode"
}

mkdir -p ~/.claude

cat > ~/.claude/config.json << 'EOF'
{
  "primaryApiKey": "qcode"
}
EOF

mkdir -p ~/.claude

cat > ~/.claude/config.json << 'EOF'
{
  "primaryApiKey": "qcode"
}
EOF

注意：primaryApiKey の値は何でも構いません（qcode など）。このフィールドを設定するだけで OK です。実際の API 認証は、環境変数で設定した ANTHROPIC_AUTH_TOKEN を使用します。

重要：設定ファイルは config.json であり、settings.json ではありません。これら 2 つのファイルを注意して区別してください。

ステップ 3：Trae を再起動¶

設定完了後、Trae を再起動して変更を有効にします。

Trae 内蔵 AI との関係¶

Trae の内蔵 AI（Agent と Chat）は、もはや ByteDance の自社バックエンドだけを使う構成ではありません。公式文書には「内蔵モデル以外にも、カスタムモデルの接続に対応する」とあり、カスタム設定の種別では API 形式・リクエストアドレス・モデル ID・認証情報を指定します。API 形式の選択肢の一つが Anthropic Messages 形式で、公式の記述は「Anthropic の /v1/messages 仕様に対応し、Claude 系列および同 API 互換のモデルサービスに適用。典型的な互換サービスとして Anthropic Claude、一部のカスタム API プロキシなどが挙げられます」となっています。

QCode のアドレスに当てはめると次のとおり（参考表記。当社側で Trae 内での実測はしていません）：

モデル ID は qcode.cc/models 掲載どおりの文字列を、API キーにはあなたの cr_ キーを指定してください。

QCode.cc サービスを既に購入している場合は、プランを最大限活用するため、Claude Code 拡張機能を主に使用することを推奨します。

使用方法¶

キーボードショートカット¶

よく使う機能¶

1. コード説明

2. コードを選択

3. 右クリックで "Ask Claude" を選択するかショートカットを使用

4. 質問を入力、例：「このコードを説明して」

5. コード生成

6. Claude パネルを開く

7. 必要な機能を説明

8. Claude がコードを生成し、挿入オプションを提供

9. コードリファクタリング

10. リファクタリングするコードを選択

11. Claude にリファクタリングを依頼

12. プレビューして変更を適用

13. エラー修正

14. コードにエラーがある場合

15. エラーコードまたはメッセージを選択
16. Claude に分析と修正案を依頼

設定オプション¶

Trae 設定で Claude Code 拡張機能の動作を調整できます（これらの設定は VS Code と共通です）：

1. 設定を開く（Ctrl+, / Cmd+,）

2. "Claude Code" を検索

3. 必要に応じてオプションを調整

よく使う設定¶

{
  "claude-code.autoSuggest": true,
  "claude-code.inlineChat": true
}

ターミナル CLI との併用¶

Trae 拡張機能とターミナル CLI は一緒に使用できます：

トラブルシューティング¶

マーケットで Claude Code が見つからない¶

症状：Trae 拡張機能パネルで "Claude Code" を検索しても結果が表示されない、または Anthropic 公式版でない結果が返される。

解決策：経路 B：オフライン .vsix ローカルインストール（上記ステップ 1 を参照）に切り替えてください。公式の見解は「TraeCode のマーケットに無い拡張機能は VS Code のマーケットから入れられる」というだけで、中国版／国際版の区別は述べられていません。

Trae CN で .vsix をダウンロードできない¶

症状：marketplace.visualstudio.com にアクセスできない、またはダウンロード速度が 0。

解決策：

1. 安定した国際回線またはプロキシ経由で Marketplace から .vsix をダウンロード

2. または QCode.cc サポートに Claude Code 拡張機能 .vsix ミラーリンクを依頼

3. ダウンロード後、「VSIX からインストール」方法でロード

Claude Code パネルが空白 / 起動しない¶

1. ~/.claude/config.json が存在し、JSON 形式が有効であることを確認

2. ファイル名が config.json であり、settings.json ではないことを確認（これが最もよくある落とし穴）

3. 環境変数 ANTHROPIC_BASE_URL と ANTHROPIC_AUTH_TOKEN が正しく設定されていることを確認

4. ターミナルで claude を実行して CLI が動作することを確認

ショートカットが Trae 内蔵 AI と競合する¶

Cmd+Esc / Ctrl+Esc が Trae の Agent / Chat に取られている場合：

1. Trae 設定 → キーボードショートカットを開く

2. claude-code または Claude Code を検索

3. "Claude Code: Toggle Panel" を競合しないキーに再割り当て

接続タイムアウト¶

1. https://asia.qcode.cc にネットワーク接続できるか確認

2. ANTHROPIC_BASE_URL 環境変数の設定を確認

3. プロキシなし環境の中国本土ユーザーには、大陸加速ノード https://api.qcode.cc/api を推奨します（probe.qcode.cc でのリクエスト確認に対応）

次のステップ¶

• CLI テクニック で効率を向上

• ワークフロー で開発フローを最適化

• VS Code も併用している場合は VS Code 統合 を参照

企業版 →