[VS Code]エクスプローラー内を更新日付（降順）で並べ替える方法

概要

このサイト、Zenn.devで記事を投稿する際、Zenn CLIを使用する事により、
「 VS Code × GitHub × Zenn.dev 」を連携し記事を投稿しています。

• 参考情報：最初にZenn CLIを導入した際の覚え書き
  https://zenn.dev/haretokidoki/scraps/9319e748e3120e

Zenn CLIのコマンドnpx zenn new:articlesで新規記事を作成すると“ランダム14桁の半角英数字のMarkdownファイル（例：12345678901234.md）”が自動的に生成されます。

画像：Zennn CLIで自動生成されたMarkdownファイルの一覧
　
VS Codeの左側にアイコンがあるエクスプローラーの並び順の初期値が名前順となっており、
最近、ファイル数が増えた影響で特定のMarkdownファイルを探すのが不便になっていました。
（並べ替えるまで、記事のタイトルに含まれる文字列を検索しファイルを探していた）

面倒に感じ調べてみると、VS Code（Visual Studio Code）のエクスプローラー内を更新日付順に並べ替える設定方法を見つけたので紹介。

なお、更新日付順以外の設定項目についても公式サイトのヘルプを見つけたので合わせて紹介します。

この記事のターゲット

• VS Codeを利用している方
• アクティビティ バー（左側にあるアイコン群） - エクスプローラー 内の並び順を変更したい方

設定方法

Visual Studio Code（VS Code）の左側にある アクティビティ バー（Activity Bar） - エクスプローラー（Explorer）内、
フォルダーやファイルの並び順を更新日付順に変更する方法。

1. 設定を開く

   • アクティビティ バーにある歯車アイコン（左側にある一番下のアイコン）をクリック

   もしくは

   • ショートカットキーでの起動方法は、「Ctrl + ,（カンマ）」

2. 設定でユーザータブ - 機能 - エクスプローラーに移動する

   ユーザータブ と ワークスペースタブ の違い

   • ユーザータブ
     VS Code全体に反映される設定。（今回はユーザータブで設定）
   • ワークスペースタブ
     ワークスペースごとに反映される設定。

   参考情報 < クリックで折りたたみが開く >

   • 設定にある ユーザータブ と ワークスペースタブ の違い
   • VS Codeでワークスペースを活用する方法

3. Sort Orderを「modified」に変更
   設定を「default」から「modified」に変更。
   
   画像：変更後の画面。VS Code - 設定 - ユーザータブ - 機能 - エクスプローラー - Sort Order 「modified」

   Sort Order

   エクスプローラーでのファイルとフォルダーのプロパティベースの並び替えを制御します。Explorer > File Nesting: Enabled が有効になっている場合は、入れ子になったファイルの並び替えも制御します。
   引用元：VS Code - 設定 - ユーザータブ - 機能 - エクスプローラー - Sort Order 欄より

更新日付順（modified）以外の設定項目を紹介

公式のヘルプページを参考に設定項目の表を作成しました。原文が英語で機械翻訳（DeepL翻訳）を使用。

設定値	内容
default（デフォルト順）	ファイルとフォルダーは名前順にソートされます。フォルダーはファイルの前に表示されます。
mixed（混合順）	ファイルとフォルダーは名前順にソートされます。ファイルはフォルダーと一緒に表示されます。
filesFirst（ファイルファースト順）	ファイルとフォルダーは名前順にソートされます。ファイルはフォルダーより先に表示される。
type（タイプ順）	ファイルとフォルダーは拡張子の種類でグループ化され、名前順にソートされます。フォルダーはファイルの前に表示されます。
modified（更新日付順） 👆 今回変更した設定	ファイルとフォルダーは最終更新日順にソートされます。フォルダーはファイルの前に表示されます。
foldersNestsFiles（フォルダーネストファイル順）	ファイルとフォルダーは名前順にソートされます。フォルダーはファイルの前に表示。ネストされた子を持つファイルは、他のファイルの前に表示されます。

公式サイトの原文 - 英語 < クリックで折りたたみが開く >

• 原文（英語）

  // Controls the property-based sorting of files and folders in the Explorer.
  // - default: Files and folders are sorted by their names. Folders are displayed before files.
  // - mixed: Files and folders are sorted by their names. Files are interwoven with folders.
  // - filesFirst: Files and folders are sorted by their names. Files are displayed before folders.
  // - type: Files and folders are grouped by extension type then sorted by their names. Folders are displayed before files.
  // - modified: Files and folders are sorted by last modified date in descending order. Folders are displayed before files.
  // - foldersNestsFiles: Files and folders are sorted by their names. Folders are displayed before files. Files with nested children are displayed before other files.
  "explorer.sortOrder": "default",

  引用元：Visual Sutdio Code 公式サイト - User and Workspace Settingsより

• DeepL翻訳した結果
  DeepL翻訳 - English to 日本語

参考情報

https://note.com/esweat/n/nb8d5764150a5

まとめ

• アクティビティ バー - エクスプローラー の名前順を更新日付順に変更する場合
  設定を開き、ユーザータブ（もしくはワークスペースタブ） - 機能 - エクスプローラー内のSort Orderを「default」から「modified」に変更。