はじめに
みんな大好き VSCode はおよそ月次で New Feature たちがリリースされる。
最新の 2024 年 4 月の新機能の中からいくつかピックアップして簡単な例を添えて紹介したいと思う。
なお、以下 json の設定は全て settings.json で行うものとする。User settings か Workspace settings かは、設定項目によって適宜調整するべし。また、リリースされた全機能を網羅しているわけではないのでご了承いただきたい。
動作確認環境
- Mac: Apple M1 Pro/macOS Sonoma バージョン 14.4
- VSCode: version 1.89.1
主な基本操作
- Quick Open を開く:
⌘+P - コマンドパレットを開く:
⌘+Shift+P- 設定ファイル (settings.json) を開く: Preferences: Open User Settings(JSON) / Preferences: Open Workspace Settings(JSON) 選択
1. Local workspace extensions
🎉できるようになったこと
workspace 単位で extension を導入できる機能が GA となった（2024 March リリースでは experimental であった）。これにより、「この extension はプロジェクトでは必要だがあのプロジェクトには入れたくない」といったニーズに応えられるようになった。
⚙️設定方法
プロジェクトルートに .vscode/extensions フォルダを作成し、その中にインストールしたい extension 一式を格納する。extension 一式は、今回は VSCode 公式のテスト用拡張 などをダウンロードしてきた。
※ [余談] vscode のリポジトリは超巨大なことが推測されるため、プロジェクト全体を git pull するのは気が引ける。特定のフォルダのみをダウンロードする方法 に則った実際のコマンドを紹介する。
mkdir vscode
cd vscode
git init
git remote add -f origin git@github.com:microsoft/vscode.git
git config core.sparseCheckout true
echo ".vscode/extensions" >> .git/info/sparse-checkout
git pull origin main
# copy
cp .vscode/extensions/vscode-selfhost-test-provider <path_to_your_project>/.vscode/extensions
VSCode 左メニュー > Extensions で確認すると、先ほど追加した workspace 用の extension が表示される。
2. Custom Editor Labels in Quick Open
🎉できるようになったこと
タブに設定したカスタムラベルで各ファイルを検索できるようになった。
カスタムラベルについては、2024 March リリース分を参照。
🪛️操作方法
Quick Open を開いて確認できる。
3. Find in trees keybinding
🎉できるようになったこと
左サイドの Explorer での検索コマンドと、エディタでの検索コマンドが同じため、フォーカス状態によっては意図しない検索がなされることがあった。これへの対処として、前者の Explorer での検索コマンドのデフォルトキーバインディングが変更になった。
これからは Explorer での検索は ⌥ + ⌘ + F となる。
⚙️設定方法
デフォルトでは上記の通りだが、変更したい場合は以下の手順でキーバインディングを編集する。
-
⌘+K->Sで Keyboard Shortcuts 画面を開く。 -
Type to search in keybindings の検索窓に
list.findを入力する。 - 下の画像の箇所をお好みに変更する。
4. Auto detect system color mode improvements
🎉できるようになったこと
システムのカラーテーマ (light or dark) を VSCode が自動で検知し、それに応じたカラーテーマのみに絞って選択オプションとして表示してくれるようになった。
🪛️操作方法
コマンドパレット > Preferences: Color Theme を選択すると、システムのカラーテーマに基づいたテーマの表示がなされる。
⚙️設定方法
{
"window.autoDetectColorScheme": true,
"workbench.preferredDarkColorTheme": <your favorite dark theme>, // システムがダークテーマの場合に有効
"workbench.preferredLightColorTheme": <your favorite light theme>, // システムがライトテーマの場合に有効
"workbench.colorTheme": <your favorite theme> // window.autoDetectColorScheme: false の場合に有効
}
5. Save/restore open editors when switching branches
🎉できるようになったこと
初めて切るブランチへ遷移する際、エディタを閉じるかそのままにしておくか（empty or current）を指定できるようになった。
なお、一度作成したブランチへ 2 回目以降の切り替え時は、切り替え先のブランチで前に開いていたエディタを表示するようである。 (empty/current に関わらず)
⚙️設定方法
初めてのブランチへ切り替えるとき、心機一転したい時の設定は以下の通り。
{
"scm.workingSets.enabled": true,
"scm.workingSets.default": "empty" // default: "current"
}
6. Dedicated commands for viewing changes
🎉できるようになったこと
Source Control で状態別で差分を見たいとき、すなわち staged, un-staged and untracked changes をそれぞれ専用に確認するためのコマンドが追加された。
🪛️操作方法
コマンドパレット > Git: View Staged Changes, Git: View Changes, or Git: View Untracked Changes を選択する。
7. Quick Search
🎉できるようになったこと
テキストサーチが可能になった。（024 March リリースでは experimental であった）
同様のことは、Explorer 上で検索 (⌘ + F) によっても実現可能だが、Quick Search による検索は、よりダイナミックな検索ができ（入力ごとにヒットが絞られる）、候補にカーソルを移動することで該当のファイルがエディタ上で表示されるのもポイント高い。
⚙️設定方法
{
"workbench.action.quickTextSearch": ??? // 設定方法未確認だが、なくてもデフォルトで有効っぽい
}
🪛操作方法
コマンドパレット > Search: Quick Search
利用頻度が高そうなので、ショートカットを登録するのがオススメ。
ファイルの切り替えがパシッパシッと気持ちいい。
8. Hover to preview images and videos in Markdown
🎉できるようになったこと
markdown ファイル内の画像や動画をカーソルでホバーすることで、ファイル全体のプレビューなしにホバーしたコンテンツのみをプレビューすることが可能になった。
ただしインターネット上の http リンクを指定した場合には機能しない。
9. GitHub Copilot
9.1 Terminal inline chat
Terminal にて ⌘ + I で Copilot とチャットができる。
9.2 Copilot powered rename suggestions button
シンボルのリネームをサジェストしてくれる魔法のボタンが導入された。
所感
何気に生産性を爆上げしてくれそうなアップデートがなされていると思っており、最近は Git の GUI ツールを使用せず VSCode 内で完結させている私からすると変更を効率的に確認できる機能は重宝しそうだ。そして、なんと言っても Quick search の爆速加減には気持ちいいの一言で、該当箇所を高速で見つけられそうだ。また、markdown のヘビーユーザーでもある私的には md ファイル内でプレビューなしに画像の確認ができるのは嬉しい。
GitHub Copilot 機能は、code completion 以外ほぼ使っていないが、課金してるので興味を持ち続けたい。円安ツライ。。