概述
在其核心，Visual Studio Code是一個程式碼編輯器。像許多其他的程式碼編輯器一樣，VS code採用一個通用的使用者介面和左側的資源管理器佈局，顯示你可以訪問的所有檔案和資料夾，右側的編輯器顯示你已經開啟的檔案的內容。
基本佈局VS Code提供了一個簡單直觀的佈局，最大限度地利用了編輯器提供的空間，同時為瀏覽和訪問資料夾或專案的完整上下文留下了足夠的空間。UI分為五塊：
Editor（編輯器）：編輯檔案的主要區域。您可以在垂直和水平方向上並排開啟任意多個編輯器。Side Bar（邊欄）：包含不同的檢視，如資源管理器，以協助您的專案工作。Status Bar（狀態列）：有關開啟的專案和您編輯的檔案的資訊。Activity Bar（活動欄）：它位於最左側，允許您在檢視之間切換，併為您提供額外特定的上下文指示，比如啟用Git時輸出變化的數量。Panels（面板）：您可以在編輯器區域下方顯示不同的面板，以顯示輸出或除錯資訊、錯誤和警告或整合終端。面板也可以向右移動以獲得更多的垂直空間。每次你啟動VS Code時，它都會以上次關閉它時的狀態開啟。資料夾、佈局和開啟的檔案都被保留。每個編輯器中的開啟的檔案都顯示在編輯器區域頂部的帶選項卡標題(選項卡)中。
提示：您可以將側邊欄移動到右邊(View > Appearance > Move Side Bar Right)或切換其可見性(Ctrl+B)。
並排編輯您可以在垂直和水平方向上並排開啟任意多個編輯器。如果你已經打開了一個編輯器，有多種方法可以開啟另一個編輯器到現有編輯器的旁邊：
按住Alt鍵，然後單擊資源管理器中的檔案。Ctrl+\將活動編輯器一分為二。透過資源管理器中，選中檔案右鍵，選擇選單Open to the Side (Ctrl+Enter)單擊編輯器右上角的Split Editor按鈕（Ctrl+\）。將檔案拖放到編輯器區域的任何一側。在Quick Open(Ctrl+P)檔案列表中，透過上下鍵選擇檔案然後Ctrl+Enter (macOS: Cmd+Enter)或者透過滑鼠在選擇的檔案後面點選Open to the Side。每當您開啟另一個檔案時，處於活動狀態的編輯器將顯示該檔案的內容。因此，如果您有兩個並排的編輯器，並且想要將檔案“ foo.cs”開啟到右側編輯器中，請在開啟檔案“ foo.cs”之前，確保該編輯器處於活動狀態（透過在其中單擊）。
預設情況下，新開啟編輯器將活動編輯器的右側。您可以透過設定workbench.editor.openSideBySideDirection更改此行為。並將其配置為在活動編輯器的底部開啟新的編輯器。
當您開啟多個編輯器時，您可以透過按住Ctrl (macOS: Cmd)鍵並按1、2或3快速切換它們。
提示：您可以調整編輯器的大小並重新排序。拖放編輯器標題區域以重新定位或調整編輯器大小。
迷你地圖一個迷你地圖(程式碼大綱)給你原始碼的一個高階概述，這對於快速導航和理解程式碼是很有用的。檔案的迷你地圖顯示在編輯器的右側。您可以單擊或拖動陰影區域，以快速跳轉到檔案的不同部分。
迷你地圖
提示：你可以將迷你地圖移動到左邊或完全禁用它，可以透過在你的使用者或工作空間設定中分別設定"editor.minimap.side": "left"或"editor.minimap.enabled": false。
縮排指南上面的影象還顯示了縮排參考線(豎線)，幫助您快速檢視匹配的縮排級別。如果您想禁用縮排參考線，您可以在您的使用者或工作區設定中設定"editor.renderIndentGuides": false。
麵包屑編輯器的內容上方有一個名為麵包屑的導航欄。它顯示當前位置，並允許您在資料夾、檔案和符號之間快速導航。
麵包屑路徑總是顯示檔案路徑，如果當前檔案型別對符號有語言支援，則符號路徑一直到游標位置。你可以用View > Show Breadcrumbs切換命令禁用麵包屑。
資源管理器資源管理器用於瀏覽、開啟和管理專案中的所有檔案和資料夾。VS Code是基於檔案和資料夾的：你可以透過在VS Code中開啟一個檔案或資料夾立即開始。
在VS Code中開啟一個資料夾後，該資料夾的內容顯示在資源管理器中。你可以從這裡做很多事情：
VS Code可以很好地與您可能使用的其他工具配合使用，尤其是命令列工具。如果你想在VS Code中開啟的資料夾的上下文中執行命令列工具，右鍵單擊該資料夾並在命令提示符中選擇Open in Integrated Terminal(或者在macOS或Linux的終端中選擇Open in Terminal)。
您還可以透過右鍵單擊檔案或資料夾，並選擇在Reveal in Explorer(或在macOS上的Reveal in Finder或在Linux上的Open Containing Folder)，導航到本地資源管理器中的檔案或資料夾的位置。
提示：鍵入Ctrl+P(Quick Open)可以快速搜尋並根據檔名開啟檔案。
預設情況下，VS Code會從資源管理器中排除一些資料夾(例如：.git)。使用files.exclude設定來配置從資源管理器隱藏檔案和資料夾的規則。
提示：這對於隱藏派生資原始檔非常有用，比如在Unity中的\*.meta或在TypeScript專案中的\*.js。對於Unity來說排除了\*.cs.meta檔案，模式選擇為:"**/*.cs.meta": true。對於TypeScript，你可以用"**/*.js": {"when": "$(basename).ts"}來排除為TypeScript檔案生成的JavaScript。
多選您可以在File Explorer 和OPEN EDITORS檢視中選擇多個檔案，以對多個專案執行操作(刪除、拖放、開啟到側面)。使用Ctrl/Cmd鍵點選選擇單獨的檔案和Shift+點選選擇的範圍。如果您選擇了兩個專案，您現在可以使用郵件選單Compare Selected命令來快速地比較兩個檔案。
注意：在早期的VS Code版本中，按下Ctrl/Cmd鍵將開啟旁邊的新編輯器組中的檔案。如果您仍然喜歡這種行為，您可以使用workbench.list.multiSelectModifier設定將多選更改為使用Alt鍵。
"workbench.list.multiSelectModifier": "alt"您可以在檔案資源管理器中輸入要過濾當前可見的檔案。將焦點放在檔案資源管理器上後，開始輸入想要匹配的部分檔名。您將在檔案資源管理器的右上角看到一個篩選框，其中顯示到目前為止您所輸入的內容，並將突出顯示匹配的檔名。當您按下游標鍵來上下移動檔案列表時，它將在匹配的檔案或資料夾之間跳轉。
過濾文件樹
大綱檢視大綱檢視是檔案資源管理器底部的一個單獨的部分。展開時，它將顯示當前活動編輯器的符號樹。
大綱檢視
大綱檢視具有不同的“排序依據”模式，可選的游標跟蹤，並支援通常的開啟手勢。它還包括一個輸入框，可以在輸入時查詢或過濾符號。錯誤和警告也顯示在大綱檢視中，讓您可以粗略地看到問題的位置。
對於符號，檢視依賴於由您安裝的擴充套件為不同檔案型別計算的資訊。例如，內建的Markdown支援返回Markdown檔案符號的Markdown頭層次結構。
大綱檢視
有幾個大綱檢視設定，允許你啟用/禁用圖示和控制錯誤和警告顯示(所有預設啟用)：
outline.icons：切換顯示大綱元素的圖示。outline.problems.enabled：顯示大綱元素上的錯誤和警告outline.problems.badges：切換對錯誤和警告使用徽章。outline.problems.colors：切換對錯誤和警告新增顏色。開啟的編輯器在資源管理器的頂部是一個標籤為OPEN EDITORS的檢視。這是活動檔案或預覽的列表。你正在工作使用的這些檔案是你之前在VS Code中開啟的。例如，如果以下情況，檔案將在OPEN EDITORS檢視中列出：
對檔案進行更改。雙擊檔案的標題。在資源管理器中雙擊一個檔案。開啟一個不屬於當前資料夾的檔案。只要點選開啟的編輯器檢視中的一個專案，它就會在VS Code中啟用。完成任務後，您可以從OPEN EDITORS檢視中逐個刪除檔案，或者使用檢視:Close All Editors或View:Close All Editors in Group來刪除所有檔案。
檢視檔案資源管理器只是VS Code中可用的檢視之一。也有以下檢視：
Search （搜尋）：在開啟的資料夾中進行全域性搜尋和替換。Source Control（原始碼管理）:VS Code預設包含Git原始碼控制。Run（執行）：VS Code的執行和除錯檢視顯示變數、呼叫堆疊和斷點。Extensions（擴充套件）：在VS Code中安裝和管理你的擴充套件。Custom views（自定義檢視）：由擴充套件提供的檢視。提示：您可以使用view > open view命令開啟任何檢視。
開啟檢視
您可以在主檢視中顯示或隱藏檢視，也可以透過拖放對它們進行重新排序。
檢視操作
命令面板VS Code同樣可以透過鍵盤訪問。要知道的最重要的組合鍵是Ctrl+Shift+P，它會調出命令面板。從這裡，您可以訪問VS Code的所有功能，包括最常見操作的鍵盤快捷鍵。
命令面板
命令面板提供了對許多命令的訪問。您可以使用相同的互動式視窗執行編輯器命令、開啟檔案、搜尋符號和檢視檔案的快速輪廓。以下是一些建議：
Ctrl+P：可以讓你透過輸入檔名導航到任何檔案或符號。Ctrl+Tab：將迴圈瀏覽最後開啟的一組檔案。Ctrl+Shift+P：將直接將您帶到編輯器命令。Ctrl+Shift+O：可以讓你導航到檔案中的特定符號。Ctrl+G：將讓您導航到檔案中的特定行。型別?輸入欄位，以獲得可用命令的列表，您可以從這裡執行：
可用命令列表
配置編輯器VS Code提供了許多選項來配置編輯器。在View選單中，可以隱藏或切換使用者介面的各個部分，如側邊欄、狀態列和活動欄。
隱藏選單欄(Windows, Linux)您可以隱藏選單欄在Windows和Linux與View > Appearance > Toggle Menu Bar命令。您仍然可以透過按Alt鍵(window.menuBarVisibility setting)訪問選單欄。
設定大多數編輯器配置儲存在可以直接修改的設定中。您可以透過使用者設定全域性設定選項，或者透過工作區設定每個專案/資料夾。設定值儲存在settings.json檔案中。
選擇File > Preferences > Settings(或按Ctrl+,)來編輯使用者settings.json檔案。要編輯工作空間設定，請選擇WORKSPACE SETTINGS選項卡來編輯工作空間settings.json檔案。macOS使用者請注意： Preferences選單在Code下，不是在File下。例如：Code > Preferences > Settings。
設定
你會在左邊的視窗中看到VS Code的預設設定，右邊是你的可編輯settings.json。您可以使用頂部的搜尋框輕鬆地過濾Default Settings中的設定。透過單擊設定左邊的編輯圖示，將設定複製到右邊的可編輯settings.json上。帶有一組固定值的設定允許您選擇一個值作為其編輯圖示選單的一部分。
編輯設定後，透過Ctrl+S儲存更改。這些變動將立即生效。
注意：工作區設定將覆蓋使用者設定，對於跨團隊共享專案特定設定非常有用。
禪定模式禪定模式讓你專注於你的程式碼，隱藏除編輯器之外的所有UI(沒有活動欄，狀態列，側邊欄和麵板)，進入全屏並居中編輯器佈局。禪定模式可以使用檢視選單，命令面板或快捷鍵Ctrl+ kz來切換。雙Esc退出禪定模式。可以透過zenMode.fullScreen禁用轉換到全屏。禪定模式可以透過以下設定進一步調整：zenMode.hideStatusBar, zenMode.hideTabs, zenMode.fullScreen, zenMode.restore 和zenMode.centerLayout
居中編輯器佈局您可以透過View > Appearance >Centered Layout，來開啟和關閉居中編輯器佈局，居中編輯器佈局允許您將編輯器區域居中對齊。當在大型顯示器上使用單個編輯器時，這特別有用。你可以使用側面的框來調整檢視的大小(按住Alt鍵獨立移動框)。
選項卡Visual Studio Code在編輯器上方的標題區域中顯示帶有選項卡（帶選項卡的標題）的開啟的專案。
開啟檔案時，會為該檔案新增一個新選項卡。
選項卡
如果你不想使用選項卡，你可以透過將workbench.editor.showTabs設定為false來禁用該特性。
"workbench.editor.showTabs": false預設情況下，新選項卡會被新增到現有選項卡的右側，但您可以透過workbench.editor.openPositioning設定控制新選項卡出現的位置。
例如，您可能希望新的選項卡項出現在左邊：
"workbench.editor.openPositioning": "left"當您在資源管理器中單擊或選擇一個檔案時，它將以預覽模式顯示，並重用現有的選項卡。如果您正在快速瀏覽檔案，並且不希望每個訪問過的檔案都有自己的選項卡，那麼這非常有用。
當您開始編輯該檔案或使用雙擊從資源管理器開啟該檔案時，將有一個專用於該檔案的新選項卡。
預覽模式在標籤標題中用斜體表示：
預覽模式
如果你不喜歡使用預覽模式，總是建立一個新標籤，你可以透過以下設定來控制行為：
workbench.editor.enablePreview全域性啟用或禁用預覽編輯器。workbench.editor.enablePreviewFromQuickOpen從Quick Open啟用或禁用預覽編輯器。編輯器組當您拆分編輯器時(使用Split Editor或Open to Side命令)，將建立一個新的編輯器區域，該區域可以容納一組編輯器。您可以在垂直和水平方向上並排開啟任意多個編輯器區域。
你可以在資源管理器檢視頂部的OPEN EDITORS部分清楚地看到這些：
編輯器組
您可以在工作臺中拖放編輯器組，在組之間移動單個選項卡，並快速關閉整個組(Close All)。
注意：無論你是否啟用了選項卡，VS Code都會使用編輯器組。如果沒有選項卡，編輯器組就是開啟項的堆疊，在編輯器窗格中可以看到最近選中的項。
網格編輯器佈局預設情況下，編輯器組以垂直列布局(例如，當您拆分一個編輯器以將其開啟到一邊時)。您可以輕鬆按自己喜歡的任何佈局在垂直和水平方向上排列編輯器組：
編輯器佈局
為了支援靈活的佈局，您可以建立空的編輯器組。預設情況下，關閉編輯器組的最後一個編輯器也將關閉該組本身，但是您可以使用新設定workbench.editor.closeEmptyGroups: false更改此行為。
編輯器佈局
在新的View > Editor Layout選單中有一組預定義的編輯器佈局：
編輯編輯器佈局方式
向一側開啟的編輯器(例如，透過單擊編輯器工具欄Split Editor操作)將預設開啟活動編輯器的右側。如果您喜歡在活動編輯器下面開啟編輯器，請配置新設定workbench.editor.openSideBySideDirection: down。
有許多鍵盤命令可以單獨使用鍵盤來調整編輯器的佈局，但如果你更喜歡使用滑鼠，拖放是一種快速的方法，可以將編輯器分割成任意方向：
調整編輯器佈局
專業提示：如果你按住Alt鍵，同時將滑鼠懸停在工具欄動作拆分編輯器，它將提供拆分到另一個方向。這是一種向右或向底部拆分的快速方法。
按方向快速拆分
鍵盤快捷鍵這裡有一些方便的鍵盤快捷鍵，可以在編輯器和編輯組之間快速導航。
Ctrl + PageDown：切換右側的編輯器。Ctrl + PageUp：切換左側的編輯器。Ctrl + Tab：開啟編輯器組MRU列表中的上一個編輯器。Ctrl + 1：轉到最左側的編輯器組。Ctrl + 2：轉到中心編輯器組。Ctrl + 3：轉到最右邊的編輯器組。Ctrl + F4：關閉活動的編輯器。Ctrl + KW：關閉編輯器組中的所有編輯器。Ctrl + K Ctrl + W：關閉所有編輯器。不使用選項卡如果您不喜歡使用選項卡(選項卡標題)，可以透過將workbench.editor.showTabs設定為false來完全禁用選項卡(選項卡標題)。
禁用預覽模式如果沒有選項卡，檔案資源管理器的OPEN EDITORS部分是進行檔案導航的一種快速方法。使用預覽編輯器模式，單擊開啟時檔案不會新增到OPEN EDITOR列表或編輯器組。您可以透過workbench.editor.enablePreview和workbench.editor.enablePreviewFromQuickOpen設定禁用此功能。
Ctrl+Tab在整個編輯器歷史中導航您可以更改Ctrl+Tab的鍵繫結，以顯示獨立於活動編輯器組的歷史記錄中開啟的所有編輯器的列表。
編輯您的要繫結的快捷鍵，並新增以下內容：
{ "key": "ctrl+tab", "command": "workbench.action.openPreviousEditorFromHistory" },{ "key": "ctrl+tab", "command": "workbench.action.quickOpenNavigateNext", "when": "inQuickOpen" },如果你喜歡VS Code在關閉一個編輯器時關閉整個組的行為，你可以在按鍵繫結中繫結以下內容。
macOS：
{ "key": "cmd+w", "command": "workbench.action.closeEditorsInGroup" }Windows/Linux：
{ "key": "ctrl+w", "command": "workbench.action.closeEditorsInGroup" }VS Code有一些選項來控制在會話之間如何開啟或恢復視窗(例項)。設定 window.openFoldersInNewWindow 和 window.openFilesInNewWindow提供配置開啟新視窗或重用檔案或資料夾的上一個活動視窗，可能的值是 default，on和off。
如果配置為default，我們將根據發出開啟請求的上下文來對是否重用視窗進行最佳判斷。將此選項設定為on或off，以始終保持相同的行為。例如，如果你覺得從File選單中選擇一個檔案或資料夾應該總是開啟一個新視窗，那麼將這個設定為on。
注意：仍然有可能忽略此設定(例如，在使用-new-window或-reuse-window命令列選項時)。
window.restoreWindows設定告訴VS Code如何恢復你上一個會話開啟的視窗。預設情況下，VS Code將恢復你在上一個會話中處理過的所有視窗(setting:all)。將此設定更改為none以永遠不開啟任何視窗，並且總是從一個空的VS Code例項開始。將其更改為one，以重新開啟上次開啟的視窗，或僅恢復已開啟資料夾的視窗
接下來的步驟現在你已經瞭解了VS Code的整體佈局，開始透過檢視以下主題來定製你喜歡的編輯器：
（Changing the Theme）改變主題：設定一個顏色或檔案圖示主題到你的偏好（https://code.visualstudio.com/docs/getstarted/themes）。常見問題如何更改縮排參考線的顏色?縮排導向顏色和大多數VS Code UI元素一樣是可定製的。若要為當前活動顏色主題自定義縮排參考線顏色，請使用workbench.colorCustomizations設定並修改editorIndentGuide.background值。
例如，要使縮排參考線亮藍色，新增以下內容到你的settings.json：
"workbench.colorCustomizations": { "editorIndentGuide.background": "#0000ff"}當然可以，您可以使用explorer.openEditors.visible設定隱藏開啟的編輯器列表，該設定宣告在捲軸出現之前要顯示多少項。當你有一個開啟的資料夾時，設定"explorer.openEditors.visible": 0將隱藏開啟的編輯器。如果你使用VS Code檢視單獨的鬆散檔案，列表仍然會顯示出來，因為它們不會顯示在資料夾窗格中。