komoto / エンジニアブログ

プログラミングについてアウトプットします。

【VSCode】便利なショートカット

はじめに

普段使っているVSCodeのショートカットをまとめました。
目的ごとにグループ分けしているので、非効率だと感じる作業に合わせて読んでいただければ幸いです。
環境はWindowsです。 Macの方は、Ctrl → Command, Alt → Optionに読み替えてください。

目次

  1. ファイル操作
    1. 新規作成
    2. ファイルを開く
    3. 名前を付けて保存
    4. 上書き保存
    5. すべてのファイルを上書き保存
  2. 表示ウィンドウとレイアウトの変更
    1. ターミナル(シェル)起動
    2. コマンドパレット起動
    3. 左サイドバー最小化
    4. 設定メニュー表示
  3. コード編集
    1. 次行に改行を入れる
    2. 前行に改行を入れる
    3. 矢印キーの方向へコードを移動
    4. 矢印キーの方向へコードをコピー
    5. コメント化
    6. 次行を一括選択
    7. 行ごとカット
    8. 行ごとコピー
    9. 同一単語の選択
    10. カーソルを追加
    11. 矢印キー方向にカーソルを追加
  4. 検索と置換
    1. 任意の単語を検索
    2. 任意の単語を置換

1. ファイル操作

動作 キー
新規作成 Ctrl+N
ファイルを開く Ctrl+O
名前を付けて保存 Ctrl+Shift+S
上書き保存 Ctrl+S
すべてのファイルを保存 Ctrl+Alt+S

VSCodeに限らずどのソフトでもよく使うショートカットです。
たくさんのファイルを編集したときには、Ctrl+Alt+S保存のし忘れをなくせます。

2. 表示ウィンドウとレイアウトの変更

動作 キー
ターミナル(シェル)起動 Ctrl+@
コマンドパレット起動 Ctrl+Shift+P
左サイドバー最小化 Ctrl+B
設定メニュー表示 Ctrl+,

ターミナルを起動することでコマンドを打てるようになるので、Web開発などでよく使用します。
ターミナルからフレームワークのコマンドを打ち、インストールしたりサーバを起動させることなどができます。 サーバサイドのエンジニアであればよく使うのではないでしょうか。

コマンドパレットVSCodeのあらゆる機能から実行したいコマンドなどを検索し実行するときに使用します。
例えば、上記で上げたショートカット動作も検索できますし、コードのコンパイルやデバック・実行、VSCodeのテーマの変更など、実に様々なことができます。

3. コード編集

動作 キー
次行に改行を入れる Ctrl+Enter
前行に改行を入れる Ctrl+Shift+Enter
矢印キーの方向へ行を移動 Alt+矢印キー
矢印キーの方向へ行をコピー Alt+Shift+矢印キー
コメント化 Ctrl+/
次行を一括選択 Ctrl+L
行ごとカット Ctrl+X
行ごとコピー Ctrl+C
同一単語の選択 Ctrl+D
カーソル追加 Alt+左クリック
矢印キー方向にカーソル追加 Ctrl+Alt+矢印キー

Ctrl+X, Ctrl+Cについてはカーソルを任意の行に置いた状態でCtrl+X, Ctrl+Cを入力することで行ごとにカット・コピーができます。

4. ワード検索と置換

動作 キー
任意の単語を検索・置換 Ctrl+F

置換方法を次の通りです。 f:id:tkmt-hrkz:20200731161024p:plain f:id:tkmt-hrkz:20200731161028p:plain