はじめに
Microsoftの提供するVisual Studio Code（VSCode）は、2015年の最初のリリースから、今では開発用エディタの定番の座を占めるまでになりました。これには、無償で使えることも大きいですが、何よりエディタとしての使いやすさ、そしてさまざまな拡張機能によっていくらでも使い勝手を向上させたり、利用の領域を拡げたりできることも大きいでしょう。
本連載では、このVSCodeにフォーカスし、基本的な使い方から拡張機能の活用、そして本格的な開発現場での利用を想定した高度な機能までを紹介していくことで、読者がVSCodeマスターになるお手伝いをします。
対象読者
- テキストエディタメインで開発してきた方
- Visual Studioより軽い環境が欲しいと考えている方
- Visual Sudio Codeをもっと使いこなしたいという方
必要な環境
本記事の内容は、以下の環境で動作を確認しています。
-
macOS Sequoia 15.5
- Visual Studio Code 1.102.1
Copilot Vision
VS Code 1.98でCopilot Vision（以降、Vision）がサポートされました。Visionは、チャットにおいて画像をコンテキストとすることができる機能です。以下のような用途に利用できます。
- コードの画像からレビューさせる
- Webページの画像からマークアップを生成する
- エラーメッセージの写った画像からデバッグさせる
［NOTE］拡張機能Vision for Copilot Preview
VS Code 1.98より前のバージョンでは拡張機能Vision for Copilot Previewのインストールが必要でした。1.98以降では既定で有効になっているので、拡張機能のインストールは不要です。
Visionの使い方は簡単です。Askモードなどのコンテキストがアタッチできる状態で画像ファイルをドラッグ＆ドロップするか、［コンテキストの追加...］から［ファイルとフォルダー...］を選択して画像ファイルを指定するだけです。ただし、後者の方法はダイアログボックス等で選べるわけではないので、前者の方法が直感的です。
コードの画像からレビュー
共同作業している開発者のエディター画面を送ってもらってレビューするといったことが可能です。図1のPythonコードをレビューしてもらうことを想定します。特別なエディタではなく、Windowsのメモ帳で開いたファイルです。
このファイルをプロンプトパネルにドラッグ＆ドロップし、質問として「このコードの意味を教えて。」などと投げます（図2）。
少々長いですが、図3の回答が得られました。画像のコードを読み取り、極めて的確にコードの内容を説明してくれます。
コードをテキストとしてコピー＆ペーストでやり取りするのではなく、画像そのままでやり取りすればいいので非常に便利です。