VS Codeのキーバインドを完全ガイド｜便利ショートカットとカスタマイズ方法

「VS Codeで作業していて、もっと効率的にショートカットを使いたい」
「自分好みのキーバインドに変えたい」

と思ったことはありませんか？

VS Codeはショートカット（キーバインド）を自由自在にカスタマイズできるエディタです。

この記事では、以下の内容について詳しく解説します：

• よく使う基本ショートカット一覧
• カテゴリ別の便利なキーバインド
• キーバインドのカスタマイズ方法
• 高度な設定とコンディション指定
• 他のエディタからの移行設定
• おすすめのキーバインド集
• トラブルシューティング

自分だけの最強開発環境を作り上げましょう！

VS Codeキーバインドの基本概念

キーバインド（ショートカット）とは

キーバインドは、特定のキーの組み合わせでコマンドを実行する機能です。

メリット

• 作業効率の大幅向上 – マウス操作が不要
• 集中力の維持 – 手をキーボードから離さない
• 筋肉記憶の活用 – 慣れると無意識に実行
• カスタマイズ性 – 自分好みに調整可能

キー表記の見方

表記	Windows/Linux	Mac
Ctrl	Ctrl	Cmd
Alt	Alt	Option
Shift	Shift	Shift
↑↓←→	矢印キー	矢印キー

組み合わせ表記例

• Ctrl + S – Ctrlキーを押しながらSキー
• Ctrl + K Ctrl + S – Ctrl+Kを押した後、Ctrl+S

必須の基本キーバインド

ファイル操作

操作	Windows/Linux	Mac	効果
新規ファイル	Ctrl + N	Cmd + N	新しいファイルを作成
ファイルを開く	Ctrl + O	Cmd + O	ファイル選択ダイアログを開く
保存	Ctrl + S	Cmd + S	現在のファイルを保存
名前を付けて保存	Ctrl + Shift + S	Cmd + Shift + S	新しい名前で保存
すべて保存	Ctrl + K S	Cmd + K S	開いているファイルをすべて保存
ファイルを閉じる	Ctrl + W	Cmd + W	現在のタブを閉じる
閉じたファイルを再開	Ctrl + Shift + T	Cmd + Shift + T	最近閉じたファイルを再開

編集操作

操作	Windows/Linux	Mac	効果
元に戻す	Ctrl + Z	Cmd + Z	直前の操作を取り消し
やり直し	Ctrl + Y	Cmd + Shift + Z	取り消した操作をやり直し
コピー	Ctrl + C	Cmd + C	選択範囲をコピー
切り取り	Ctrl + X	Cmd + X	選択範囲を切り取り
貼り付け	Ctrl + V	Cmd + V	クリップボードから貼り付け
全選択	Ctrl + A	Cmd + A	ファイル全体を選択
行選択	Ctrl + L	Cmd + L	現在行全体を選択

高度な編集操作

操作	Windows/Linux	Mac	効果
行削除	Ctrl + Shift + K	Cmd + Shift + K	現在行を削除
行複製	Shift + Alt + ↓	Shift + Option + ↓	現在行を下に複製
行移動（上）	Alt + ↑	Option + ↑	現在行を上に移動
行移動（下）	Alt + ↓	Option + ↓	現在行を下に移動
行の先頭/末尾	Home/End	Cmd + ←/→	行の開始・終了位置へ移動
単語選択	Ctrl + D	Cmd + D	現在の単語を選択（連続で実行すると同じ単語を追加選択）
単語移動	Ctrl + ←/→	Option + ←/→	単語単位で移動

ナビゲーション系キーバインド

ファイル・タブ操作

操作	Windows/Linux	Mac	効果
クイックオープン	Ctrl + P	Cmd + P	ファイル名で高速検索・開く
コマンドパレット	Ctrl + Shift + P	Cmd + Shift + P	すべてのコマンドを検索実行
タブ切り替え	Ctrl + Tab	Cmd + Tab	最近使用したタブへ切り替え
前のタブ	Ctrl + PageUp	Cmd + Shift + [	左のタブへ移動
次のタブ	Ctrl + PageDown	Cmd + Shift + ]	右のタブへ移動
特定のタブ	Ctrl + 1~9	Cmd + 1~9	指定番号のタブへ移動

エディタレイアウト

操作	Windows/Linux	Mac	効果
サイドバー表示切替	Ctrl + B	Cmd + B	エクスプローラーの表示/非表示
パネル表示切替	Ctrl + J	Cmd + J	下部パネル（ターミナル等）の表示/非表示
エディタ分割	Ctrl + \	Cmd + \	エディタを縦に分割
エディタグループ移動	Ctrl + 1/2/3	Cmd + 1/2/3	分割したエディタ間を移動
Zen Mode	Ctrl + K Z	Cmd + K Z	集中モード（UI要素を隠す）

画面内ナビゲーション

操作	Windows/Linux	Mac	効果
行番号へジャンプ	Ctrl + G	Cmd + G	指定行番号へ移動
ファイル内シンボル	Ctrl + Shift + O	Cmd + Shift + O	関数・クラス一覧から選択
定義へジャンプ	F12	F12	関数・変数の定義位置へ移動
参照を表示	Shift + F12	Shift + F12	その要素が使われている箇所を一覧表示
戻る/進む	Alt + ←/→	Ctrl + -/Shift + -	ナビゲーション履歴を移動

検索・置換系キーバインド

基本的な検索・置換

操作	Windows/Linux	Mac	効果
検索	Ctrl + F	Cmd + F	ファイル内検索を開く
置換	Ctrl + H	Cmd + Option + F	検索・置換画面を開く
次を検索	F3	Cmd + G	次の検索結果へ移動
前を検索	Shift + F3	Cmd + Shift + G	前の検索結果へ移動
すべて選択	Alt + Enter	Cmd + Enter	検索結果をすべて選択

ワークスペース全体での検索

操作	Windows/Linux	Mac	効果
全体検索	Ctrl + Shift + F	Cmd + Shift + F	ワークスペース全体で検索
全体置換	Ctrl + Shift + H	Cmd + Shift + H	ワークスペース全体で置換

開発・デバッグ系キーバインド

コード編集支援

操作	Windows/Linux	Mac	効果
自動補完	Ctrl + Space	Cmd + Space	IntelliSenseを表示
パラメータヒント	Ctrl + Shift + Space	Cmd + Shift + Space	関数のパラメータ情報を表示
クイックフィックス	Ctrl + .	Cmd + .	エラー修正候補を表示
フォーマット	Shift + Alt + F	Shift + Option + F	コードを自動整形
リネーム	F2	F2	シンボルをリネーム
コメント切替	Ctrl + /	Cmd + /	行コメントの追加/削除
ブロックコメント	Shift + Alt + A	Shift + Option + A	ブロックコメントの追加/削除

デバッグ操作

操作	Windows/Linux	Mac	効果
デバッグ開始	F5	F5	デバッグセッションを開始
ブレークポイント切替	F9	F9	ブレークポイントの設定/解除
ステップオーバー	F10	F10	次の行へ移動（関数には入らない）
ステップイン	F11	F11	関数内部へ移動
ステップアウト	Shift + F11	Shift + F11	関数から抜ける

ターミナル操作

操作	Windows/Linux	Mac	効果
ターミナル表示	Ctrl + Shift + ` `	Cmd + Shift + ` `	統合ターミナルを開く
新しいターミナル	Ctrl + Shift + 5	Cmd + Shift + 5	新しいターミナルインスタンスを作成

キーバインドのカスタマイズ方法

GUIでの変更

基本的な設定手順

1. キーボードショートカット設定を開く
   • Ctrl + K Ctrl + S（Mac: Cmd + K Cmd + S）
   • または「ファイル」→「基本設定」→「キーボードショートカット」
2. コマンドを検索
   • 検索欄にコマンド名を入力（例：delete line）
   • または既存のキーバインドを入力して逆引き検索
3. キーバインドを変更
   • 変更したい項目の右側にある鉛筆アイコンをクリック
   • 新しいキーの組み合わせを入力
   • Enterで確定

便利な検索フィルター

• @source:default – デフォルトのキーバインドのみ表示
• @source:user – ユーザーがカスタマイズした設定のみ表示
• @source:extension – 拡張機能が追加したキーバインド

keybindings.jsonでの詳細設定

ファイルを開く方法

1. キーボードショートカット設定画面で右上の {} アイコンをクリック
2. または Ctrl + Shift + P → 「Preferences: Open Keyboard Shortcuts (JSON)」

基本的な記述形式

[
  {
    "key": "ctrl+d",
    "command": "editor.action.deleteLines",
    "when": "editorTextFocus"
  }
]

設定項目の説明

• key – キーの組み合わせ
• command – 実行するコマンド
• when – 実行条件（オプション）

より詳細な設定例

複数のキーバインドを設定

[
  {
    "key": "ctrl+shift+d",
    "command": "editor.action.duplicateSelection",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+shift+l",
    "command": "editor.action.transformToLowercase",
    "when": "editorTextFocus && editorHasSelection"
  },
  {
    "key": "ctrl+shift+u", 
    "command": "editor.action.transformToUppercase",
    "when": "editorTextFocus && editorHasSelection"
  }
]

既存のキーバインドを無効化

[
  {
    "key": "ctrl+shift+p",
    "command": "-workbench.action.showCommands"
  },
  {
    "key": "f1",
    "command": "workbench.action.showCommands"
  }
]

高度なキーバインド設定

コンテキスト（when条件）の活用

よく使われるwhen条件

条件	意味
editorTextFocus	エディタがフォーカスされている
editorHasSelection	テキストが選択されている
editorLangId == javascript	JavaScriptファイルを編集中
inDebugMode	デバッグモード中
terminalFocus	ターミナルがフォーカスされている
explorerViewletFocus	エクスプローラーがフォーカスされている

複雑な条件の組み合わせ

[
  {
    "key": "ctrl+enter",
    "command": "workbench.action.terminal.runSelectedText",
    "when": "editorTextFocus && editorHasSelection && !inDebugMode"
  },
  {
    "key": "ctrl+shift+enter",
    "command": "python.execInTerminal",
    "when": "editorTextFocus && editorLangId == python"
  }
]

連続キー操作（チェーンキー）

Vim風の操作を実現

[
  {
    "key": "ctrl+k ctrl+s",
    "command": "workbench.action.files.saveAll"
  },
  {
    "key": "ctrl+k ctrl+w",
    "command": "workbench.action.closeAllEditors"
  },
  {
    "key": "ctrl+k ctrl+r",
    "command": "workbench.action.reloadWindow"
  }
]

マクロ的な複数コマンド実行

拡張機能「multi-command」を使用

[
  {
    "key": "ctrl+shift+s",
    "command": "extension.multiCommand.execute",
    "args": {
      "sequence": [
        "editor.action.formatDocument",
        "editor.action.organizeImports",
        "workbench.action.files.save"
      ]
    }
  }
]

言語・用途別のおすすめキーバインド

JavaScript/TypeScript開発者向け

[
  {
    "key": "ctrl+shift+i",
    "command": "editor.action.organizeImports",
    "when": "editorTextFocus && (editorLangId == javascript || editorLangId == typescript)"
  },
  {
    "key": "ctrl+shift+r",
    "command": "editor.action.refactor",
    "when": "editorTextFocus && (editorLangId == javascript || editorLangId == typescript)"
  },
  {
    "key": "ctrl+shift+t",
    "command": "typescript.goToSourceDefinition",
    "when": "editorTextFocus && editorLangId == typescript"
  }
]

Python開発者向け

[
  {
    "key": "ctrl+shift+p",
    "command": "python.execInTerminal",
    "when": "editorTextFocus && editorLangId == python"
  },
  {
    "key": "f5",
    "command": "python.debugInTerminal",
    "when": "editorTextFocus && editorLangId == python"
  },
  {
    "key": "ctrl+shift+f",
    "command": "python.formatting.formatDocument",
    "when": "editorTextFocus && editorLangId == python"
  }
]

HTML/CSS開発者向け

[
  {
    "key": "ctrl+shift+l",
    "command": "editor.emmet.action.wrapWithAbbreviation",
    "when": "editorTextFocus && (editorLangId == html || editorLangId == css)"
  },
  {
    "key": "ctrl+shift+d",
    "command": "editor.emmet.action.removeTag",
    "when": "editorTextFocus && editorLangId == html"
  }
]

他のエディタからの移行

Vim風キーバインド

Vim拡張機能と組み合わせた設定

[
  {
    "key": "ctrl+h",
    "command": "workbench.action.navigateLeft",
    "when": "!inDebugMode"
  },
  {
    "key": "ctrl+j", 
    "command": "workbench.action.navigateDown",
    "when": "!inDebugMode"
  },
  {
    "key": "ctrl+k",
    "command": "workbench.action.navigateUp", 
    "when": "!inDebugMode"
  },
  {
    "key": "ctrl+l",
    "command": "workbench.action.navigateRight",
    "when": "!inDebugMode"
  }
]

Emacs風キーバインド

[
  {
    "key": "ctrl+f",
    "command": "cursorRight",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+b",
    "command": "cursorLeft", 
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+p",
    "command": "cursorUp",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+n",
    "command": "cursorDown",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+a",
    "command": "cursorHome",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+e",
    "command": "cursorEnd",
    "when": "editorTextFocus"
  }
]

Sublime Text風キーバインド

[
  {
    "key": "ctrl+d",
    "command": "editor.action.addSelectionToNextFindMatch",
    "when": "editorFocus"
  },
  {
    "key": "ctrl+shift+l",
    "command": "editor.action.insertCursorAtEndOfEachLineSelected",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+shift+d",
    "command": "editor.action.duplicateSelection",
    "when": "editorTextFocus"
  }
]

おすすめのカスタムキーバインド集

生産性向上のための設定

[
  {
    "key": "ctrl+shift+o",
    "command": "workbench.action.quickOpen"
  },
  {
    "key": "ctrl+shift+e",
    "command": "workbench.view.explorer"
  },
  {
    "key": "ctrl+shift+g",
    "command": "workbench.view.scm"
  },
  {
    "key": "ctrl+shift+x",
    "command": "workbench.view.extensions"
  },
  {
    "key": "ctrl+shift+y",
    "command": "workbench.view.debug"
  }
]

テキスト操作の効率化

[
  {
    "key": "ctrl+shift+backspace",
    "command": "deleteWordLeft",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+shift+delete",
    "command": "deleteWordRight", 
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+shift+enter",
    "command": "editor.action.insertLineAbove",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+enter",
    "command": "editor.action.insertLineBelow",
    "when": "editorTextFocus"
  }
]

ファイル管理の効率化

[
  {
    "key": "ctrl+shift+n",
    "command": "explorer.newFile",
    "when": "explorerViewletFocus"
  },
  {
    "key": "ctrl+shift+f",
    "command": "explorer.newFolder",
    "when": "explorerViewletFocus"
  },
  {
    "key": "f2",
    "command": "renameFile",
    "when": "explorerViewletFocus && !inputFocus"
  }
]

キーバインドの管理とトラブルシューティング

設定のバックアップと同期

設定ファイルの場所

Windows:

%APPDATA%\Code\User\keybindings.json

Mac:

~/Library/Application Support/Code/User/keybindings.json

Linux:

~/.config/Code/User/keybindings.json

VS Code Settings Syncの活用

VS Code標準の設定同期機能を使用：

1. Ctrl + Shift + P → 「Settings Sync: Turn On」
2. GitHubアカウントでサインイン
3. 同期する項目を選択（キーバインドを含む）

よくある問題とその解決方法

キーバインドが効かない場合

1. 競合の確認

• キーボードショートカット設定で該当キーを検索
• 複数のコマンドが同じキーに割り当てられていないか確認

2. when条件の確認

{
  "key": "ctrl+s",
  "command": "workbench.action.files.save",
  "when": "editorTextFocus"  // エディタにフォーカスがない場合は動作しない
}

3. 拡張機能との競合

• 拡張機能を一時的に無効にして確認
• @source:extension で拡張機能のキーバインドを確認

設定がリセットされる場合

settings.jsonとkeybindings.jsonの権限確認

# Linux/Mac の場合
chmod 644 ~/.config/Code/User/keybindings.json

設定ファイルの妥当性確認

• JSON記法が正しいか確認
• VS Code下部のステータスバーでエラー表示を確認

デバッグとテスト

キーバインドのテスト方法

1. コマンドパレットでの確認

• Ctrl + Shift + P でコマンドパレットを開く
• 設定したコマンドが存在するか確認

2. ログでの確認

• Help → Toggle Developer Tools
• コンソールでキーバインドのログを確認

3. 段階的なテスト

// まずシンプルなキーバインドで動作確認
[
  {
    "key": "ctrl+alt+t",
    "command": "workbench.action.terminal.new"
  }
]

パフォーマンスとベストプラクティス

効率的なキーバインド設計

覚えやすいパターンの採用

カテゴリ別のプレフィックス

[
  // ファイル操作: Ctrl + F + ?
  {
    "key": "ctrl+f ctrl+n",
    "command": "workbench.action.files.newUntitledFile"
  },
  {
    "key": "ctrl+f ctrl+o",
    "command": "workbench.action.files.openFile"
  },
  
  // Git操作: Ctrl + G + ?
  {
    "key": "ctrl+g ctrl+s",
    "command": "git.stage"
  },
  {
    "key": "ctrl+g ctrl+c",
    "command": "git.commit"
  }
]

筋肉記憶を活用したレイアウト

左手でのナビゲーション

[
  {
    "key": "alt+j",
    "command": "workbench.action.navigateDown"
  },
  {
    "key": "alt+k", 
    "command": "workbench.action.navigateUp"
  },
  {
    "key": "alt+h",
    "command": "workbench.action.navigateLeft"
  },
  {
    "key": "alt+l",
    "command": "workbench.action.navigateRight"
  }
]

パフォーマンスの最適化

不要なキーバインドの削除

[
  // 使わない機能のキーバインドを無効化
  {
    "key": "ctrl+shift+p",
    "command": "-workbench.action.showCommands"
  },
  {
    "key": "f1",
    "command": "-workbench.action.showCommands"
  }
]

when条件の最適化

[
  // 具体的な条件を指定してパフォーマンス向上
  {
    "key": "ctrl+enter",
    "command": "python.execSelectionInTerminal",
    "when": "editorTextFocus && editorLangId == python && editorHasSelection"
  }
]

まとめ

VS Codeのキーバインドを完全マスターするためのポイントをまとめました：

基本的なキーバインド

• ファイル操作 – Ctrl + S（保存）、Ctrl + P（クイックオープン）
• 編集操作 – Ctrl + D（単語選択）、Alt + ↑/↓（行移動）
• ナビゲーション – Ctrl + G（行ジャンプ）、F12（定義へ移動）

カスタマイズの方法

• GUI設定 – Ctrl + K Ctrl + S で簡単設定
• JSON設定 – keybindings.json で高度な制御
• when条件 – 実行コンテキストの細かい指定

効果的な活用法

• カテゴリ別プレフィックス – 覚えやすいキーの組み合わせ
• 筋肉記憶の活用 – 手の動きを最適化
• 段階的な導入 – 少しずつ慣れていく

実用的な設定例

初心者向けの基本セット

[
  {
    "key": "ctrl+d",
    "command": "editor.action.deleteLines",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+shift+d",
    "command": "editor.action.duplicateSelection",
    "when": "editorTextFocus"
  },
  {
    "key": "alt+j",
    "command": "workbench.action.navigateDown"
  },
  {
    "key": "alt+k",
    "command": "workbench.action.navigateUp"
  }
]

上級者向けの効率化セット

[
  {
    "key": "ctrl+k ctrl+s",
    "command": "workbench.action.files.saveAll"
  },
  {
    "key": "ctrl+k ctrl+f",
    "command": "editor.action.formatDocument"
  },
  {
    "key": "ctrl+k ctrl+r",
    "command": "workbench.action.reloadWindow"
  },
  {
    "key": "ctrl+shift+enter",
    "command": "extension.multiCommand.execute",
    "args": {
      "sequence": [
        "editor.action.formatDocument",
        "editor.action.organizeImports",
        "workbench.action.files.save"
      ]
    }
  }
]

次のステップ

キーバインドをマスターしたら、以下も試してみてください：

• スニペット機能 との組み合わせで更なる効率化
• タスク機能 でのビルド・テスト自動化
• ワークスペース設定 でのプロジェクト別最適化
• 拡張機能開発 での独自コマンド作成

よくある質問

Q: キーバインドが多すぎて覚えられません

A: 段階的に導入しましょう

1. まず5個程度の基本的なキーバインドから始める
2. 1週間ごとに新しいキーバインドを追加
3. 使用頻度の高い操作から優先的に設定

Q: 他の人と設定を共有したいです

A: チーム共有の方法

• Settings Sync で個人設定を同期
• ワークスペース設定 でプロジェクト固有の設定を共有
• 拡張機能 での設定テンプレート配布

Q: キーバインドがアプリケーションと競合します

A: 競合回避の方法

• システムのショートカットを確認
• 他のアプリケーションの設定を調整
• VS Code固有のキー（F1〜F12など）を活用