VS Code 1.78の新機能が便利! 画像の相対パスが簡単に入力できるようになったぞ
Post on:2023年5月10日
VS Codeで画像のパスを入力するとき、今まではフォルダツリーで画像を右クリックして「パスのコピー」「相対パスのコピー」でパスを取得していたと思います。
先日アップデートされたVS Code 1.78で、画像ファイルをshiftキーを押しながらドロップするだけで、相対パス・完全パスが入力できるようになりました。

これはドロップセレクタと呼ばれるもので、VS Codeではshiftキーを押しながらドロップすることでファイルやコンテンツをエディタに挿入することができます。今までは画像のドロップで画像ファイルを開く、shiftドロップでファイル名でした。
VS Code 1.78のアップデートでこの挿入する方法を変更できるUIが追加されました。shiftキーを押しながらドロップすると、相対パス・完全パスを切り替えて挿入することができます。

Visual Studio Code April 2023 (version 1.78)
画像を選択して、ドロップ操作してからshiftキーを押しながらドロップで、この操作ができます。
※shiftキーを押してからドロップ操作ではできません。

あとは、右下のアイコンからパスを切り替えることができます。

ドロップセレクタのコントロールは、コンテンツをドロップした際に必ず表示され、複数の方法で挿入できます。コントロールはクリックか⌘.で開くことができます。ドロップセレクタはエディタでの入力を開始するか、外側にカーソルを移動すると、すぐに消えます。
この機能を無効にするには、settings.jsonで設定します。
1 |
editor.dropIntoEditor.showDropSelector": "never" |
VS Code 1.78の他のアップデート情報は下記をご覧ください。
sponsors