vs-explorer

April 14, 2026 · View on GitHub

VS Code 的工作區域雖然便於管理程式碼專案,但在處理本地資源時仍有不足。當需要整理下載在外部的素材、瀏覽參考檔案、進行批量檔案操作、或是想知道當前系統狀態時,往往必須切換到其他應用,打斷了在 VS Code 中的工作流程。

本擴展就是為了嘗試在 VS Code 內實現更流暢的本地互動。以下,將從使用者介面的四個主要區域來介紹這個系統瀏覽器的功能。


側邊欄

位於畫面左側,可透過按鍵 N 展開或收起,承載所有導航輔助功能。內含多個可獨立收合的子面板,每個子面板皆整合了篩選、排序與拉伸調整高度等操作。

書籤

功能名稱功能描述
書籤列表列出所有已收藏的資料夾書籤,點擊即可快速導航至該位置
添加書籤將目前選取的或作用中的資料夾加入書籤
刪除書籤移除目前選取的書籤項目
清空書籤一次移除所有書籤
移至頂部/底部將選取的書籤移動到列表最前方或最後方
上下移動微調書籤在列表中的排列順序

瀏覽記錄

功能名稱功能描述
最近瀏覽以時間順序列出最近造訪過的資料夾(預設模式),維護至多 50 筆紀錄
歷史紀錄對應導航歷史堆疊,可以瀏覽完整的前進/後退歷程
最常瀏覽依據各路徑的造訪次數排序,方便快速回到最常使用的資料夾
清除記錄清空所有瀏覽紀錄,僅保留當前路徑

系統

功能名稱功能描述
系統資料夾自動列出 Windows 的關鍵資料夾(桌面、下載、音樂、圖片、OneDrive 等),搭配對應圖示,點擊直接導航
磁碟機列表顯示所有本機邏輯磁碟的名稱、檔案系統格式與已使用/總容量
重新整理手動重新讀取磁碟機資訊

導航欄

位於畫面上方,包含所有主要導航功能,以及對於視圖的檢視設定。

歷史與路徑

功能名稱功能描述
上一個資料夾回到上一個瀏覽過的資料夾(Alt + ←
下一個資料夾前往下一個瀏覽過的資料夾(Alt + →
上層資料夾往上一層目錄(Alt + ↑),已在根目錄時不可用
重新整理重新讀取當前目錄或圖片(Ctrl + R),tooltip 會顯示上次更新的相對時間
新增資料夾在當前目錄建立新的資料夾(僅在目錄模式下可用)
路徑顯示地址列顯示當前路徑,過長路徑會自動以 ... 縮短顯示
路徑跳轉直接在地址列輸入完整路徑,失焦時自動導航至該路徑

檢視選項

功能名稱功能描述
模式切換在「表格檢視」與「圖片網格檢視」之間切換
模糊搜尋以關鍵字即時搜尋當前目錄中的檔案與資料夾名稱
排序設定目錄模式下可依名稱、修改日期、建立日期、大小進行排序,點擊相同欄位可切換升序/降序
網格尺寸圖片模式下可選擇小(5 欄)、中(3 欄)、大(2 欄)
網格間距圖片模式下可切換是否顯示圖片之間的間距
過濾切換啟用或停用過濾功能(僅在目錄模式下可用)
過濾條件可選擇僅顯示「檔案」、「資料夾」或「剪貼簿中的項目」

內容區域

位於畫面中央,瀏覽目錄內容的主要區域。每個目錄都有兩種檢視模式——表格檢視與網格檢視,可從導航欄無縫切換。

表格檢視

功能名稱功能描述
虛擬化渲染使用虛擬列表技術,數千個檔案也能流暢捲動
欄位資訊顯示名稱、類型、修改日期、建立日期、大小等欄位,各欄位可點擊標題排序
單擊選取點擊列即可選取,支援 Ctrl 附加選取與 Shift 範圍選取
雙擊開啟雙擊資料夾可進入該層級;雙擊檔案則以 VS Code 編輯器開啟
框選拖曳空白區域可進行框選,自動選取涵蓋範圍內的所有列,接近邊緣時自動捲動
拖放匯出將選取的檔案拖放至系統檔案總管或 VS Code,支援任意檔案
檔案類型圖示根據副檔名自動指派對應的 codicon 圖示

圖片網格檢視

功能名稱功能描述
佈局引擎使用自定義虛擬化引擎與二分搜尋演算法,高效渲染大量圖片
雙擊開啟雙擊圖片即以 VS Code 編輯器開啟
拖放匯出支援將圖片拖放至外部應用程式

操作欄

位於畫面下方(僅在目錄模式下顯示),用於對選取的項目進行單項或批次操作。

單一項目操作

功能名稱功能描述
重新命名直接在輸入框中修改最後選取項目的名稱,按下確認按鈕送出
檢視內容開啟屬性對話框,檢視選取項目的詳細資訊

選取操作

功能名稱功能描述
全選選取目前目錄中的所有項目(Ctrl + A
清除選取取消所有已選取的項目(Ctrl + Shift + A
反轉選取反轉目前的選取狀態(Ctrl + I

已選取項目操作

功能名稱功能描述
選取數量顯示即時顯示目前已選取的項目數量
刪除刪除所有已選取的項目(Delete),會彈出確認對話框
寫入剪貼簿將選取的項目寫入應用程式剪貼簿(Ctrl + C

剪貼簿操作

功能名稱功能描述
剪貼簿數量顯示即時顯示剪貼簿中的項目數量
放置將剪貼簿中的項目放置到當前資料夾(Ctrl + V),可選擇複製或移動模式,以及是否覆蓋

屬性對話框

選取項目後,可從操作欄的「內容」按鈕開啟屬性對話框,檢視完整的詳細資訊。

通用屬性

屬性說明
名稱與類型顯示檔案/資料夾名稱、對應圖示,以及根據副檔名判定的可讀類型名稱
路徑完整檔案路徑,附帶複製到系統剪貼簿按鈕
實際路徑若為符號連結,額外顯示解析後的真實路徑
建立時間格式化為易讀的日期時間格式
修改時間格式化為易讀的日期時間格式

檔案專屬屬性

屬性說明
檔案大小以二進位單位(KiB、MiB 等)格式化顯示
Windows 屬性顯示唯讀、隱藏、壓縮等檔案屬性標記
雲端可用性顯示檔案的雲端同步狀態(本機可用、連線時可用、永遠可用等),搭配對應圖示

圖片專屬屬性

屬性說明
解析度以「寬 × 高 像素」格式顯示
圖片格式顯示格式名稱(如 PNG)、色彩空間(如 SRGB)、是否含有 Alpha 透明通道

資料夾專屬屬性

屬性說明
項目數量遞迴統計資料夾內的檔案數與子資料夾數
總大小遞迴計算資料夾的總大小

快捷鍵一覽

快捷鍵功能
N開/關側邊欄
Delete刪除選取項目
Alt + ←上一個資料夾
Alt + →下一個資料夾
Alt + ↑上一層資料夾
Ctrl + R重新整理
Ctrl + C複製到剪貼簿
Ctrl + V貼上
Ctrl + A全選
Ctrl + Shift + A取消全選
Ctrl + I反轉選取

在任意輸入框中聚焦時,上述快捷鍵將不會觸發。


開啟方式

本擴充套件提供多種方式開啟系統瀏覽器:

開啟方式說明
命令面板搜尋「開啟系統瀏覽器」,透過系統對話框選擇資料夾後開啟
檔案總管右鍵選單在 VS Code 檔案總管、檔案標題列等地方,對資料夾或檔案右鍵選擇「在系統瀏覽器中顯示」
編輯器標題列按鈕點擊編輯器右上角的按鈕,以檔案所在目錄開啟系統瀏覽器
檔案總管標題列按鈕點擊 VS Code 檔案總管區段標題列的按鈕,直接開啟系統瀏覽器

安裝指南

系統需求

  • 作業系統: Windows
  • VS Code: 1.106.1 或更高版本

安裝步驟

  1. 前往 GitHub Releases 下載最新的 .vsix 檔案

  2. 在 VS Code 中安裝擴展:

    • 開啟命令面板(Ctrl+Shift+P
    • 輸入並選擇 Extensions: Install from VSIX...
    • 選擇下載的 .vsix 檔案
  3. 安裝完成後,重新啟動 VS Code 即可使用系統瀏覽器功能