こんにちは。
今月から新しい試みとしてVisual Studio Codeに関する情報などを毎月まとめて、新しいバージョンが配信された頃に定期的に配信していこうと思います。VS CodeユーザーによるVS Codeユーザーのための情報としてお役に立てばと思います。
目次
Visual Studio Code ニューリリース
Visual Studio Codeのバージョン1.81がリリースされました。
今回のリリース内容については、個人的にはそこまで心躍るような変更はありませんでしたが、皆さんはいかがでしょうか。
主なリリース
| 変更点 | 変更内容 |
|---|---|
| アクセシビリティの改善 | 通知、チャット応答、ホバーに対するアクセシビリティの表示をサポート |
| VS Code プロファイル | 部分プロファイルと「すべてのプロファイルに適用」オプションを使用したより詳細な制御 |
| 新しいDiffエディタ機能 | 変更されていない領域を折りたたみ、差分のテキストの配置が改善 |
| シンボリックリンクを使用したGいtリポジトリ | シンボリックリンクを使用したリポジトリパスのサポート |
| ノートブックの更新 | 閉じたノートブック内のテキストを検索し、「スティッキー スクロール」で Markdown ヘッダーを表示 |
| Pythonテストの検出 | エラー耐性のある pytest の検出はすべてのファイルにわたって実行される |
| GitHubコードベースのJupyterサーバーにアクセスする | コードスペースのリモートJupyter サーバーに接続 |
| GitHubプルリクエストの作成 | ベースブランチの検出が向上。以前の作成 PR オプションを覚えておく機能追加 |
| GitHub Copilot UX(プレビュー版) | クイックチャットの改善、反復的な/fixコマンド |
その他詳しいリリース内容については Visual Studio Code July 2023 にアクセスしてください。
VS Code プロファイル
これまで特定の言語向けなど限定的なプロファイルを作成することはできていましたが、今回のアップデートですべてのプロファイルに反映できるデフォルトプロファイル的な機能が追加されました。
個別のプロファイルを設定しているとはその設定が優先されるようですが、個別プロファイル側で無効化している場合は、デフォルトプロファイルの設定を反映するようになるようです。
プロファイルごとに大体同じ設定になるような設定項目もあるので、横断的に設定を合わせた場合には嬉しい機能です。
新しいDiffエディタ機能
DiffエディタのUIに大きな変更が加わりました。他にもDiffアルゴリズムの改善も行われています。まだ一般ユーザへの提供前という位置付けのようなので、使用するためには設定画面で"diffEditor.experimental.useVersion2": trueを有効にする必要があります。
気になる方は有効化してみてください。
Pytestの検出
テストエクスプローラーの表示でPytestが公式にサポートされるようになりました。
またテストエクスプローラー周りは新しいアーキテクチャの公開が色々と予定されているみたいで、その一環でこれがリリースされてきたようです。
GitHubのプルリクエスト作成機能の改善
主にプルリクエストの作成ビューの改善が色々と行われているようです。
VS Codeでプルリクエストに関係する操作をしたい派なので、使い勝手の改善は嬉しいアップデートですね。
主な改善内容：
- 常にデフォルトブランチを使用する仕様から最適なベースブランチ選択するように変更
- レビュー担当者、担当者、ラベル、マイルストーンを追加できる
- 最後に選択したオプションが記憶される(下書きや自動マージなど)
- ビューのパフォーマンスが高速化
- ブランチを公開する前にDiffを表示できる
- ブランチが公開されるとコミットを表示できる(プライベートリポジトリは近日公開予定)
拡張機能
人気ランキング
Visual Studio Codeのマーケットプレイスに公開されている人気ランキンを元にしています。
2023/08/04 時点の情報を反映しています
今月の拡張機能
コラボレーションインターフェースデザインツールのFigmaが公式にVS Code向けの拡張機能を提供開始されました。
現在は、オープンベータ版としての提供となっています。
使用できる条件は？
- チームやプランに制限なし
- 表示アクセス権限を持つデザインファイルが対象
- 開発モードが有効になっている
https://help.figma.com/hc/en-us/articles/15023121296151
どんなことができるの？
Figma上で開発モードを有効化する必要があり、開発モードにある検査機能がメイン機能になっているようです。
僕自身もまだあまり開発モードを使用したことがないのでどのようなことができるのかについてはピンときていないのです。
- どのデザインが開発の準備ができているか確認する
- フレームとレイヤーを簡単にナビゲート
- コードスニペットを表示
- 開発リソースにアクセス
- コンポーネントプロパティを表示
- どのセクションが開発の準備ができているかを表示する
- オートコンプリートの提案
- コメント通知を表示する
ざっと一覧にして眺めてみたら、オートコンプリート機能は少し気になる機能だったので、拡張機能ページのGifアニメーションを見てみたのですが、CSSの定義などをコピペしたりする作業の軽減には繋がりそうですね。
ちなみに、VS Code上でFigmaを開いてみた画面のイメージはこんな感じでした。
お知らせ
VS CodeのDev Containersを使ったリモート開発環境を体験できるワークショップを開催します。
詳しくはconnpassのイベントページをご覧ください。
おわりに
VS Codeまわりについては継続的に情報収集や調査などを行っているので、知識の整理も兼ねて継続的に発信していきたいと思います。
バックナンバー
月刊VS Code通信 カテゴリーの記事一覧 - とことんDevOps | 日本仮想化技術のDevOps技術情報メディア
