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

VisualStudioCode1.26（以下、VSCode）がリリースされました。
今回はある時から姿を消していたあの機能が復活を果たしたり、項目が増えすぎた設定画面が使いやすくなったりで地味ながら更に使いやすい機能が追加されています。

Electronで実現されたエディタだけあって、Microsoft が推しに推している TypeScript や JS 方面のサポートは毎回手厚いですね。今回も面白そうな機能が実装されています。
むむ、JS が書きたくなってきたので、JS を書くお仕事がほしい！

 

パンくずリストが登場

ワークスペースのディレクトリ構造を表示するパンくずリストが登場しました。
プログラミングをしていると、同じファイル名のコードがいくつかあったりして、どっちのファイルか分からなくなることもあると思うのですが、そういう時はパンくずリストを見れば一目瞭然。

あと、これ自体がエクスプローラー的な使い方もできるので、左側を専有しがちなエクスプローラーパネルを非表示にして画面を大きく使えるようになりますね。

ちなみにエクスプローラーパネルの ON/OFF は Ctrl + B で切り替えることができます。

 

最小化したエディタをクリックすると最大化する機能が復活！

私の場合、ソースとログを左右に開きながらデバッグしている時、クリックするだけで見たいエディタを切り替えられたので重宝していた機能なのですが、いつからか消えてしまっていました。

何かと不便だなぁと思ってはいましたが、今回のリリースで嬉しい復活！

この機能はグリッドエディターレイアウトの作業中にロストしちゃった！テヘ☆ みたいな感じのコメント付きです。

setting.json に「workbench.action.minimizeOtherEditors」という設定を追記して true にすると有効になりますが、隠し項目扱いなのか左側には出てきません。
ユーザー設定、もしくはワークスペースの設定として以下のコードを settings.json に以下のように直接追加すると有効になります。

// 必要に応じて最後にカンマを追加
"workbench.action.minimizeOtherEditors": true

 

unknown configuration setting という警告が出ますが正しく動作します。
オリジナルの settings.json に登録されていないからかなと思いますが、そのうち直ると思います。

 

メニューの整理

メニューの「表示」という項目が太ってきたのでダイエットを敢行したようですね。
どうやらうまく痩せられたようで何よりです。

ショートカットキーメインで利用している私にとって前どうだったかあまり覚えていないので分かりませんが、すっきりしたメニューは大歓迎です！

 

地味に便利！ import ミスを自動で修正

JS/TS のみになりますが、インポートされていないクラスやモジュールを自動で検知して豆電球のマークで教えてくれる機能が追加されました。
undefined で悩むことも減るでしょうか？

いっそ逆の使い方として、インポートは VSCode に任せてとりあえず外部のクラスも書いて後でインポート、みたいな使い方をすると面倒事も減るかも知れませんね。

 

設定画面が見やすくなった、新しい設定エディター

インクリメンタルサーチも付いているし、そこまで困った記憶もない設定エディターですが、UI をリニューアルした新しいバージョンがプレビューとして追加されました。

左右に分かれていた JSON ファイルがなくなり、エディターの真ん中にセレクトボタンと入力ボックスで変更できる設定がズラリ。まぁ珍しくもなんともない感じになりましたね。

エクスプローラーパネルで非表示にするフィルター（node_modules とかを除外するあれです）などは、setting.json をいじった方が早いんじゃないかと思いますが、ON/OFF だけの設定ならば、こっちの方が見やすいですね。

ここは JSON ファイルで良かったんじゃないか？と思ったりしますが、見やすいことを好む人ももちろんいますから、ここは将来的に両方を共存させてほしいと願っています。

 

ターミナルで矩形選択ができるようになったようです

サーバーサイド開発をしているとターミナルこそ本当の友達という感じになってきます（友達が少ないんですね、きっと）ので、矩形選択はあると便利なので個人的にも嬉しいです。

使い方は簡単で、選択するときに Alt を押しながら選択を開始すればいいだけです。
DB の出力を一部だけコピペしたい時なんかには、特に便利ですね。

 

ユーザーごとに設定を個別化

私もそうだったんですが、Windows ですべてのユーザー向けに VSCode がインストールされている場合、カレントユーザー向けにインストールし直せという警告が出るようになりました。

毎回疑問に思っていた、アップデートの時に聞かれる謎の管理者権限の確認はそういうことだったんですね！

移行ツールも用意されていて、このツールを使うとユーザー設定もそのまま移行できるので便利です。

移行後は、以下のディレクトリに拡張機能や設定ファイルが格納されるようになります。

C:\Users\[ユーザー名]\AppData\Local\Programs\Microsoft VS Code

 

複数ユーザーで使っていた場合は VSCode を個別にインストールすることになりますが、毎回出る警告が出なくなるので警告が出ている場合は、早いうちに引っ越ししてしまいましょう。

 

まとめ

新機能のパンくずリストは、しばらく意識的に利用してみて便利なのかどうなのか、はたまた単なるエディターの表示領域を減らすだけの存在なのか、検証してみたいと思います。
こういう画面系の機能ってオススメはいくらでもできますが、実際に自分の利用シーンにマッチするかどうかは自分で使ってみないとわからないですので、ぜひ一度使われてみてはいかがでしょうか？

ちなみにこのパンくずリスト、ファイルの種類によって（例えばMarkdown）は、ファイル名の右の三点リーダーをクリックするとファイル内のヘッダー要素の一覧が出てくる仕様で、エクスプローラーとアウトラインが合体したようなものになっています。
アウトラインの機能を統合すれば、アウトライン側でパースできるファイル形式はパンくずでも表示できるはずなので、メソッドリストを表示できたりするような未来もあるかも、ですね。

 
以上です。