[Osaka/Yokohama] Looking for infrastructure/server side engineers!

[Osaka/Yokohama] Looking for infrastructure/server side engineers!

[Deployed by over 500 companies] AWS construction, operation, maintenance, and monitoring services

[Deployed by over 500 companies] AWS construction, operation, maintenance, and monitoring services

[Successor to CentOS] AlmaLinux OS server construction/migration service

[Successor to CentOS] AlmaLinux OS server construction/migration service

[For WordPress only] Cloud server “Web Speed”

[For WordPress only] Cloud server “Web Speed”

[Cheap] Website security automatic diagnosis “Quick Scanner”

[Cheap] Website security automatic diagnosis “Quick Scanner”

[Reservation system development] EDISONE customization development service

[Reservation system development] EDISONE customization development service

[Registration of 100 URLs is 0 yen] Website monitoring service “Appmill”

[Registration of 100 URLs is 0 yen] Website monitoring service “Appmill”

[Compatible with over 200 countries] Global eSIM “Beyond SIM”

[Compatible with over 200 countries] Global eSIM “Beyond SIM”

[If you are traveling, business trip, or stationed in China] Chinese SIM service “Choco SIM”

[If you are traveling, business trip, or stationed in China] Chinese SIM service “Choco SIM”

[Global exclusive service] Beyond's MSP in North America and China

[Global exclusive service] Beyond's MSP in North America and China

[YouTube] Beyond official channel “Biyomaru Channel”

[YouTube] Beyond official channel “Biyomaru Channel”

ショートカットおじさんが言うから間違いない、知って得する VSCode のショートカット集

こんにちは。
開発チームのワイルド担当、まんだいです。

少し前にも Visual Studio Code(以下、VSCode)のショートカット記事は書いているのですが、それから私も日々ショートカットをググったりコンフィグを読み漁る日々を過ごしておりました。
ショートカットをたくさん覚えて、いかにキーボードから手を離さずに作業を進められるかをテーマに日々仕事をしている訳ですが、前回から新たに覚えたショートカットから、しばらく使ってみて、自分の手に馴染んだものだけに厳選してお届けします!


 

行頭から行末まで選択状態にする

私も昔は home キーからの Shift + end というコンビネーションを多用していましたが、一発で現在の行を選択するショートカットがありました。

Ctrl + L

 

大抵の場合、行ごと消したい場合なので都合がいいのですが、行末にある改行コードも選択範囲に入っているので、稀に改行がおかしくなるケースもありますが慌てずに。

 

先頭にインデントを追加/削除

インデントを付けるには、タブキー、もしくはシフトを押しながらタブキーというのが定番かも知れませんが、 VSCode にはインデント用のショートカットも割り当てられています。

確かにタブキーでインデントを付けることは可能ですが、必ずタブキーでインデントを付けられる訳ではありません。
タブキーにインデントを付けるには、カーソルが行頭にある必要があるため、途中でインデントのズレに気付いた場合はカーソルを動かす必要がありますよね。

つまりそういうことです。

# 追加
Ctrl + ]

 

# 削除
Ctrl + [

 

増やす(減らす)数、と文字種(タブやスペース)は言語モードの設定を利用します。

 

コードフォールディング

# 折りたたむ
Ctrl + Shift + [

 

# 展開する
Ctrl + Shift + ]

 

とんでもなく長いコードを修正したりする場合は、コードフォールディングやエディタの分割( Ctrl + \ )を駆使して、なるべく行ったり来たりを繰り返して時間のロスを減らしていきたいですね。

ちなみに、「ファイル内の折りたためるところはすべて折りたたむ」コマンドも存在していて、以前紹介したかも知れませんが Ctrl + K, Ctrl + 0 のコンビネーションで全て折りたためます。
逆に「展開できるところはすべて展開する」コマンドは Ctrl + K, Ctrl + J コンビネーションですね。

 

間違って閉じちゃったファイルを開きたい

これは偶然発見したんですが、 Chrome などのブラウザと同じショートカットが割り当てられています。

Ctrl + Shift + T

 

Ctrl + W を連打しがちなせっかちさんには特にオススメのショートカットですね。

 

全てのコマンドを見たい

要するに Ctrl + Shift + P でコマンドパレットを開くということなんですが、 F1 キーだけで開くことをご存知でしたか?
だから何だよと思われるかも知れませんが、私、ドヤ顔していますよ?

 

番外編:未割り当てのショートカットを活用する

サーバーサイド開発をしていると、コードエディタとターミナルを行ったり来たりすることはよくあることです。
なのに、エディタからターミナル、ターミナルからエディタへカーソルを移動させるショートカットは標準ではショートカットキーが割り当てられていません!

なので、ここは1つ、自分の好みのポジションに割り当ててしまおうではありませんか、というわけです。

 

まずはエディタからターミナルへ移動するショートカット

キーボードショートカットの設定は、 Ctrl + K, Ctrl + S のコンビネーション(ショートカットの設定をショートカットで開くなんて!)ですね。
コマンド名は「 workbench.action.focusPanel 」となっているので、コピペで検索します。

おそらくキーバインドは空っぽになっていると思いますので、行にマウスカーソルを合わせると左に表示される、鉛筆のアイコンをクリック。

お好きなキーバインドを入力し、エンターを押せば登録完了です。

 

続いて、ターミナルからエディタへ移動するショートカット

エディタからターミナルへの移動はできるようになりましたので、今度は行ったら帰る、ターミナルからエディタへ移動するショートカットを設定します。
コマンド名は「 workbench.action.focusActiveEditorGroup 」となっているので、先程のようにコピペで検索します。
こちらもキーバインドは空っぽなので、同じ要領でキーバインドを登録。

私の場合、同じショートカットで行ったり来たりしたかったため、同じものを設定したところうまく動かず。

そこで、こちらのショートカットだけ when 式なるものを設定します。

when 式はどのタイミングでこのショートカットが有効になるかというもので、 when 式にかかれているタイミングの場合、優先される仕組みになっています。
ここではターミナルにフォーカスされている場合を示す、「terminalFocus」という when 式を設定しておきます。

すると、ターミナルにフォーカスがある場合は、ターミナルからエディタへ移動するショートカットが優先されるため、いい感じに行ったり来たりできるようになったというわけでした。

 

まとめ

ショートカットで稼いだ数秒の積み重ねはかなり重要なんじゃないかな、と思って利用し始めたはずが、ショートカットを使う、まだ見ぬ良いショートカットを発掘するのがメインになってしまいました。

ショートカットの紹介記事も数回書いているので、そろそろネタが......となりそうですが、今回はいよいよ未割り当てのコマンドという禁断の領域にまで手を染めてしまいました。
よくよく見てみると、とんでもない数のコマンドが用意されていて、標準で設定されているショートカットはまさに氷山の一角の様相です。

個別のコマンドについて、解説してあるページがなかなか見当たらないので理解できていないものも多いですが、発掘して有用な未割り当てコマンド集のようなブログも書いてみたいものです。

 
以上です。

この記事がお役に立てば【 いいね 】のご協力をお願いいたします!
0
読み込み中...
0 票, 平均: 0.00 / 10
7,531
X facebook はてなブックマーク pocket
[2024.6.30 CentOS support ended] CentOS server migration solution

[2024.6.30 CentOS support ended] CentOS server migration solution

[2025.6.30 Amazon Linux 2 support ended] Amazon Linux server migration solution

[2025.6.30 Amazon Linux 2 support ended] Amazon Linux server migration solution

[Osaka/Yokohama] Actively recruiting infrastructure engineers and server side engineers!

[Osaka/Yokohama] Actively recruiting infrastructure engineers and server side engineers!

The person who wrote this article

About the author

Yoichi Bandai

My main job is developing web APIs for social games, but I'm also fortunate to be able to do a lot of other work, including marketing.
Furthermore, my portrait rights in Beyond are treated as CC0 by him.