知り合いに教えたら、知られてなかった便利なショートカット

注意書き

僕が、Mac ユーザーなので、ショートカットは全て Mac のキーボード用のになります。

はじめに

弊社ではしょっちゅうエンジニアが部屋に集まって、大きいモニターを囲ってモブプロを行なっています。

ナビゲーターに Vimmer がいて、 Vim を勉強している人がドライバーの時は ナビゲーターから「そこに到達するには、このショートカットが使えるぞ」

と、コーディング以外のことにでもチャチャ入れをして、ワイワイ開発をしています。

そんな中、僕は Vim は勉強中なのですが、仕事で使い物にならないので、VSCode を使っています。

で、

扱うアプリを手に入れたら、基本的にひとしきり遊ぶ癖があるので、 みんなが使っていないショートカットを偶然見つけて、使い続けてる。なんてことがよくあります。

それを披露すると、部屋が湧き、気持ちが良くなります。

今回は、 僕がモブプロをしていたり、初学者の方とペアプロをしていたり、してる中で 意外と知られていないんだなーって僕が思ったショートカットをいくつか紹介していきます。

みなさんも、この記事を読んだ後、我が物顔で、披露し、ぜひ気持ち良くなってください

コマンドパレットの表示 cmd + shift + p

cmd + p を使って、ファイルを検索することはよくあると思いますが、 先頭に > をつけることで、コマンドを呼び出すことができるのはご存じでしょうか?

弊社のメンバーが、 cmd + p でファイル検索を呼び出して、先頭に > を入力してから、コマンドを入力していたのですが、 実は、 cmd + shift + p で、完結します。

シンボル検索 cmd + shift + o

VSCodeでは、 関数やクラス、メソッドなどの定義されたものを シンボル として認識されます。

🤔 cmd + f と何が違うの?

cmd + f は文字列で検索ため、定義元も参照先も同時にヒットしてしまいます。 しかし、このシンボル検索を行うことで、定義元だけに絞り込んで検索ができるので、アクセスが早いというわけです。

ちなみに、 cmd + p で呼び出したファイル検索の先頭に @ をつけると同様のことができますが、 工程が長いので、こちらを覚えましょう

エディタグループを増やす/移動する cmd + 任意の数字

エディタグループとは この枠ひとつのことです。 スクリーンショット 2021-12-07 午後10.47.45.png

DnD で、エディタグループを増やしている方はいませんか?

エディタグループが1つしかない場合、 cmd + 2 を実行することで、右側にエディタグループを作成できます。

そこで、cmd + p などで任意のファイルを開くと、 簡単に2ファイルを見比べることができます。

さらにその状態で、cmd + 1 をすると左側のエディタグループがアクティブになります。

エディタグループのインデックスを使って移動を行う、なければ作成を行う。ってイメージです

カーソルの行の内容を移動する alt + ↑/↓

alt + ↑ とすれば、カーソルの内容を一つ上に、 alt + ↓ とすれば、一つ下に、 内容をそのまま移動することができます。

よく見るのが、関数をマウスで範囲指定し、 cmd + v で切り取り、 任意の場所で、 cmd + p で貼り付ける

これが、shift + ↑/↓ で範囲指定し、 alt + ↑/↓ で移動することができるので、少し早いです。 いや、だいぶ早いです。

サイドバーを閉じる cmd + b

そのままです。

エクステンションを開く cmd + x

そのままです。 拡張機能を検索する窓です。

エクスプローラーを開く cmd + e

これもそのままです。

cmd + shift + f は言わずもがなですね。

定義元を開く f12

定義元が別ファイルであれば 別タブで開きます

定義元をウインドウで開く shift + f12

タブではなく、こんな感じで開いてくれます。 image.png

クイックフィックスを開く cmd + .

こんなのを出してくれます image.png

エラーをホバーするときに出てくる Quick fix です。

終わり

どうでしたでしょうか。 知ってたよ、ってのもあったと思います。 実際最後の方が知ってる人多いと思います。

ただ、知らない人はいるなって思ってるので、一応書いてみました。

念のため、VSCode のショートカットの一覧の PDF のリンクも貼っておきます。

https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf

もっといいのあるよー、とかあれば教えてください。

個人的にシンボル検索は、激アツです。

JS ではあんまりだったのですが、最近描いてる Go だと結構心強く動いてくれています。