OpenCode: VSCode Extension for OpenCode
最終更新：2026-08-31
--- title: VSCodeへのOpenCodeインストール description: VSCodeでのOpenCode拡張機能のインストールと使用方法を学び、エディタ内でのAIプログラミング協業を実現する order: 6 lang: ja
OpenCodeはVSCode拡張機能として使用でき、エディタ内で直接AIと協業開発が可能です。
1. 学習内容
- VSCode拡張機能のインストール方法
- エディタ内での使用方法
- ターミナル版との違い
- よく使う操作
2. 拡張機能のインストール
(1) 拡張機能マーケットからインストール
- VSCodeを開く
- 左側の拡張機能アイコンをクリック（または
Ctrl+Shift+X） - OpenCodeを検索
- Installをクリック
(2) コマンドラインからインストール
BASH
code --install-extension anomalyco.opencode
3. 接続の設定
インストール完了後、API接続の設定が必要：
- コマンドパレットを開く（
Ctrl+Shift+P） - OpenCode: Connect Providerを検索
- プロバイダーを選択し、API Keyを入力
4. 基本的な使い方
(1) OpenCodeパネルを開く
左側のOpenCodeアイコンをクリック、またはコマンドパレットでOpenCode: Open Panelを検索。
(2) 会話インタラクション
パネルで自然言語を入力：
TEXT
📖 参照専用
現在開いているファイルの主要なロジックを説明して
(3) ファイル操作
- AIはVSCodeで開いているファイルを直接読み取り可能
- 修正されたコードは自動的にエディタに適用
- diffプレビューに対応
5. VSCode版 vs ターミナル版
| 特徴 | VSCode拡張機能 | ターミナルTUI |
|---|---|---|
| インストール方法 | 拡張機能マーケット | コマンドライン |
| インターフェース | グラフィカル | ターミナル文字インターフェース |
| ファイル統合 | エディタを直接読み取り | プロジェクトディレクトリを読み取り |
| コードプレビュー | Diffビュー | ターミナル内表示 |
| ショートカット操作 | エディタコマンドパレット | / スラッシュコマンド |
| 適用シーン | 日常開発 | サーバー/自動化 |
6. よく使うショートカット操作
| 操作 | 方法 |
|---|---|
| パネルを開く | サイドバーアイコン / コマンドパレット |
| メッセージ送信 | Enter |
| モデル切り替え | コマンドパレット → OpenCode: Switch Model |
| 修正の取り消し | コマンドパレット → OpenCode: Undo |
| 新規セッション | コマンドパレット → OpenCode: New Session |
❓ FAQ
Q VSCode拡張機能とターミナル版を同時に使用できますか？
A 可能ですが、同じプロジェクトを同時に操作することは推奨されません。両者はプロジェクトファイルを共有するため、同時修正は競合の可能性があります。
Q VSCode拡張機能はどの機能をサポートしていますか？
A コア機能はターミナル版と同じで、コード分析、ファイル修正、コマンド実行を含みます。VSCode版はグラフィカルなdiffプレビューとエディタ統合を追加提供。
Q AliceはVSCodeで、Bobはターミナルで作業していますが、協業できますか？
A 可能。両者は異なるインターフェースで同じプロジェクトを操作し、OpenCodeの修正は最終的にプロジェクトファイルに反映されます。Gitでコード変更を管理することを推奨。
📖 まとめ
- VSCode拡張機能はグラフィカルな使用体験を提供
- インストール方法：拡張機能マーケットでOpenCodeを検索
- コア機能はターミナル版と同じ、diffプレビューを追加提供
- IDEワークフローに慣れた開発者に適している
📝 練習問題
-
基本問題：VSCodeにOpenCode拡張機能をインストールし、一度会話を完了してください。
-
応用問題：VSCode拡張機能でAIにコードを修正させ、diffプレビューで修正を確認してください。
-
チャレンジ問題：VSCode拡張機能とターミナルTUIの使用体験を比較し、それぞれのメリット・デメリットを列挙してください。
