VSCodeの便利なショートカット・操作

概要

便利なショートカット・操作を随時追加していきます。
ショートカットキー、マウスクリック、文字入力等を用いて実現できる機能を整理します。

各部の名称については右記：User Interface

公式が公表しているショートカットは右記：Keyboard reference sheets

エディター

コードの編集

選択したテキストの表記方法変更(大文字、小文字)

【キー操作】
・Ctrl + Shift + P + 文字入力(transform) + 表記方法を選択

【説明】
・選択したテキストを大文字、小文字に変換
・右記、参考：Visual Studio Code Tips and Tricks

エディタ管理

エディタを縦に分割

【キー操作】
・Alt + 下記画像の赤枠部にカーソルを置く + クリック

【説明】
・素早く、エディタを縦に分割できます。

右隣にエディタグループを作成(ファイル名クリック時　等)

【キー操作】
・Ctrl + ファイルをクリック

【説明】

• アクティブになっているエディタグループの右隣りにエディタグループを作成しファイルを開きます。但し、既に右隣にエディタグループが存在する場合はそのグループ内でファイルが開きます。
• 対象は下記画面上のファイル名、検索された行　等です。

フォーマット・インデント

選択行をインデント

動作	キー・操作	説明
右にインデント	・Ctrl + ]	ー
左にインデント	・Ctrl + [	ー

選択行をフォーマット

【キー操作】
・Ctrl + K + F

【説明】
・自動でフォーマットされます。
・右記、参考：Visual Studio Code Tips and Tricks

ドキュメント全体をフォーマット

【キー操作】
・Shift + Alt + F

【説明】
・自動でフォーマットされます。
・右記、参考：Visual Studio Code Tips and Tricks

コメント

行コメント

【キー操作】
・Ctrl + /

【説明】
・コメントアウト、アンコメントに対応
・現在行、選択行に対して使用可能
・例(C言語)：a　が　//a　になります。

ブロックコメント

【キー操作】
・Alt + Shift + A

【説明】
・コメントアウト、アンコメントに対応
・選択行に対して使用可能
・例(C言語)：a　が　/*a*/　になります。

エディタ内の移動

対になる{, }に移動

【キー操作】
・Ctrl + Shift + \(キーボード右上)

【説明】
・対になる{, }に移動
・C言語の場合は、本ショートカットを関数内で2回実行することで、関数の先頭に移動

関数の先頭に移動

【キー操作】
・カーソルを関数内に移動 ＋ 画像(関数の先頭に移動)の赤枠部をクリック ＋ Enter
・Ctrl + Shift + O + 関数名入力

【説明】
・カーソルがあった関数の先頭に移動

高速スクロール

【キー操作】
・Alt + マウスのホイール操作

【説明】

• エディターを高速でスクロールできます。
• 300行程度の関数であれば、マウスからキーボードに手を移動してショートカットキーで関数の先頭や末尾に移動するより高速です。
• Visual Studio Code Tips and Tricks

マルチカーソル・選択

矩形選択

【キー操作】
・Shift + Alt + クリック

【説明】
・カーソルがある位置からクリックした位置までを矩形選択します。

検索・置換

本記事では、上の太枠部を「検索ボックス」、下の太枠部を「置換ボックス」と呼びます。

検索

ファイル内のシンボルを検索

【キー操作】
・Ctrl + Shift + O　

【説明】
・ファイル内のシンボルを検索
・右記、参考：Visual Studio Code Tips and Tricks

全てのシンボルを検索

【キー操作】
・Ctrl + T

【説明】
・ワークスペース内のシンボルを検索
・右記、参考：Visual Studio Code Tips and Tricks

エディタ内を検索

【キー操作】
・Ctrl + F

【説明】
・文字を検索(移動 ＋ 強調表示)します。

次のマッチする文字を検索

【キー操作】
・F3

【説明】
・検索条件入力欄が閉じている時に有効です。閉じている場合はEnterを押しても次のマッチする文字を検索できないためです。

前のマッチする文字を検索

【キー操作】
・Shift + F3

【説明】
・検索条件入力欄が閉じている時に有効です

履歴を検索ボックスに表示

【キー操作】
・検索ボックスがフォーカスされている状態(Ctrl + F) + ↑か↓

【説明】
・↑を押すと、1つ古い履歴を表示
・↓を押すと、1つ新しい履歴を表示

開いているフォルダ内を検索

【キー操作】
・Ctrl + Shift + F

【説明】

• 開いているフォルダ内を検索します。下記画像では、ATOCDERフォルダを開いているので、ATCODERフォルダとそのサブフォルダである5フォルダ内(.vscode等)が検索されます。
  • 
  • 右記、参考：Basic Editing in Visual Studio Code
• 検索に含めるファイル、検索から除外するファイルを指定できます。ワイルドカードの(*, ?)を使用することができます。例えば、files to includeに下記の様に入力すると検索に含めるファイルをワイルドカードで指定できます。
  • 

• 右記、参考：Basic Editing in Visual Studio Code
  • 検索に利用できる*, ?以外の記号についても記述があります。

置換

エディタ内を置換

【キー操作】
・置換ボックス表示のみ：Ctrl + H
・検索と置換：Ctrl + H + 文字入力(検索対象) + Tab + 文字入力(置換後の文字) + Enter

【説明】
・「TabとShift + Tab」により、検索ボックスと置換ボックス間のフォーカス移動が出来ます。
・特定の箇所だけ置換したくない場合は、F3押下により置換せずに次の検索対象に移動します。

開いているフォルダ内を置換

【キー操作】
・Ctrl + Shift + H

【説明】

• 開いているフォルダ内を置換できます。
• 下記については「開いているフォルダ内を検索」と同様です。
  • 開いているフォルダの定義
  • 検索に含めるファイル、検索から除外するファイルにワイルドカードの*, ?が利用可能

便利なショートカットの組み合わせ

検索対象や付近に任意の文字を入力

編集したいコードの近くにキーワードがあるとわかっている場合に、キーワードを目印にしてコードの付近まで移動し編集することが出来ます。

動作	キー・操作	説明
エディタ内を検索	・Ctrl+F＋検索文字入力	・文字を検索(移動＋強調表示)します。
検索条件入力欄を閉じる	・Esc	・右上の検索条件入力欄が閉じ、検索された文字が選択された状態になります。
カーソル移動　他	・ー	※検索対象に任意の文字を上書きする場合は本動作は不要です。 ・カーソルを移動し、任意の文字を選択
任意の文字を入力	・ー	・キーボードから任意の文字を入力

移動(エディター以外)

フォーカス移動

integrated terminalをフォーカス

【キー操作】
・Ctrl + @

【説明】
・パネルのintegrated terminalに移動

Side BarのExplorerをフォーカス

【キー操作】
・Ctrl + Shift + E
・Ctrl + 0

【説明】
・Explorerに移動

editor groupをフォーカス

【キー操作】
・Ctrl + 1か2か3

【説明】
・それぞれ1番目、2番目、3番目のEditor groupをフォーカス

ファイル・フォルダ操作

編集

ファイル名・フォルダ名修正

【キー操作】
・F2

【説明】
・ファイル名・フォルダ名修正を修正

作成

ファイル作成1

【キー操作】
・Ctrl + N

【説明】
・ファイル作成。explorerをフォーカスしておく必要があります。

ファイル作成2

【キー操作】
・Ctrl + shift + P + 文字入力(newfi)

【説明】
・ファイル作成。

フォルダ作成

【キー操作】
・Ctrl + shift + P + 文字入力(newfo)

【説明】
・フォルダ作成。

開く・閉じる・たたむ

ファイルを開く

【キー操作】
・Ctrl + P + 文字入力(開くファイル名)

【説明】
・指定したファイルを開きます。コマンドパレットにファイル名を入力することでファイルを絞り込めます。また、インテリセンスの様に候補が表示されます。
・右記、参考：Visual Studio Code Tips and Tricks

エクスプローラ内のファイル・フォルダをたたむ

【キー操作】
・Ctrl + P + 文字入力(colfol)　※Collapse Folders in Explorerを選択

【説明】
・サブフォルダが数百以上ある時などに便利です。

便利なショートカットの組み合わせ

キーボードのみで任意のフォルダにファイルを作成

必要に応じて、矢印キーでアクティブにするフォルダの指定、フォルダ名・ファイル名の入力をしてください。

動作	キー・操作	説明
Side BarのExplorerに移動	・Ctrl+Shift+E ・Ctrl+0	・Explorerに移動
フォルダ作成	・Ctrl+shift+P+文字入力(newfo)	・フォルダ作成。
ファイル作成	・Ctrl+shift+P+文字入力(newfi)	・ファイル作成。

表示

全画面表示　有効化/無効化

【キー操作】
・F11

【説明】
・全画面表示の有効化/無効化が出来ます。

禅モード

有効化

【キー操作】
・Ctrl + K + Z(Ctrlは押さない)
・Ctrl + Shift + P + 文字入力(zen)

【説明】
・禅モードになります。禅モードはエディター部分のみを全画面表示することが出来るモードです。禅モード中にサイドバーやパネルを表示することも出来ます。
・右記、参考：Visual Studio Code Tips and Tricks

無効化

【キー操作】
・Ctrl + K + Z(Ctrlは押さない)
・Esc + Esc

ウィンドウ

ワークスペースを新しいウィンドウに複製

【キー操作】
・Ctrl + shft + P + 文字入力(duwo)

【説明】

• ワークスペースが新しいウィンドウで開きます。
• 1つのワークスペース上で複数種類の作業をしていて、どのファイルが何のために開いたファイルか分からない様な時に便利です。複数のウィンドウを開き、作業ごとにウィンドウを使い分けることができます。
• 右記、参照：Visual Studio Code May 2018
• 右記、参考：Visual Studio Code open tab in new window – Stack Overflow

アクティブファイルを新しいウィンドウで開く

【キー操作】
・Ctrl + K+ O(Ctrlは押さない)

【説明】

• アクティブファイルが新しいウィンドウで開きます。