現已釋出!閱讀關於 11 月新增功能和修復的內容。

多根工作區

您可以在 Visual Studio Code 中使用多根工作區來處理多個專案資料夾。當您同時處理多個相關專案時,這會很有幫助。例如,您可能有一個包含產品文件的儲存庫,您希望在更新產品原始碼時保持其最新。

multi-root hero

注意:如果您想了解更多關於 VS Code "工作區" 的概念,您可以查閱 什麼是 VS Code "工作區"? 除非您明確建立多根工作區,否則 "工作區" 只是您專案的單個根資料夾。

新增資料夾

向現有工作區新增另一個資料夾非常容易。有幾種新增資料夾的手勢

將資料夾新增到工作區

檔案 > 新增資料夾到工作區 命令會開啟一個 "開啟資料夾" 對話方塊,用於選擇新資料夾。

Add Root Folder

新增根資料夾後,資源管理器將在檔案資源管理器中顯示新資料夾作為根。您可以右鍵單擊任何根資料夾並使用上下文選單新增或刪除資料夾。

Remove Root Folder

檔案資源管理器應該像以前一樣工作和表現。您可以在根資料夾之間移動檔案,並使用上下文選單和資源管理器檢視中提供的任何典型檔案操作操作。

files.exclude 這樣的設定,如果配置了,將支援每個根資料夾,如果配置為全域性使用者設定,則支援所有資料夾。

拖放

您可以使用拖放將資料夾新增到工作區。將資料夾拖到檔案資源管理器中即可將其新增到當前工作區。您甚至可以選擇並拖動多個資料夾。

注意:將單個資料夾拖放到 VS Code 的編輯器區域仍會在單資料夾模式下開啟該資料夾。如果您將多個資料夾拖放到編輯器區域,將建立一個新的多根工作區。

您還可以使用拖放來重新排序工作區中的資料夾。

多選原生檔案開啟對話方塊

使用您平臺的原生檔案開啟對話方塊開啟多個資料夾將建立一個多根工作區。

命令列 --add

將一個或多個資料夾新增到最後一個活動的 VS Code 例項中,以形成一個多根工作區。

  code --add vscode vscode-docs

刪除資料夾

您可以使用 **從工作區刪除資料夾** 上下文選單命令從工作區中刪除資料夾。

工作區檔案

當您新增多個資料夾時,它們最初會放置在一個名為 **未命名工作區** 的工作區中,並且該名稱將一直保留,直到您儲存該工作區。您不需要儲存工作區,直到您想將其儲存在永久位置,例如您的桌面。未命名工作區存在於它們使用的 VS Code 例項開啟期間。一旦您完全關閉了具有未命名工作區的例項,如果您打算將來再次開啟它,系統會要求您儲存。

save workspace dialog

儲存工作區時,它將建立一個 .code-workspace 檔案,該檔名將在檔案資源管理器中顯示。

另存為工作區...

如果您想將工作區檔案移動到新位置,可以使用 **檔案** > **另存為工作區** 命令,它將自動設定相對於新工作區檔案位置的正確資料夾路徑。

開啟工作區檔案

要重新開啟工作區,您可以

  • 在您平臺的資源管理器中雙擊 .code-workspace 檔案。
  • 使用 **檔案** > **開啟工作區** 命令並選擇工作區檔案。
  • 從 **檔案** > **最近開啟** (⌃R (Windows, Linux Ctrl+R)) 列表中選擇工作區。
    • 工作區具有 **(工作區)** 字尾,以將其與資料夾區分開。

open recent workspace list

就像在 VS Code 中開啟單個資料夾時有 **關閉資料夾** 一樣,有一個 **關閉工作區** (⌘K F (Windows, Linux Ctrl+K F)) 命令來關閉當前活動的工作區。

工作區檔案架構

.code-workspace 的架構相當直接。您有一個資料夾陣列,其中包含絕對或相對路徑。當您想共享工作區檔案時,相對路徑更好。

您可以使用 name 屬性覆蓋資料夾的顯示名稱,為資源管理器中的資料夾賦予更有意義的名稱。例如,您可以將專案資料夾命名為 'Product' 和 'Documentation',以便透過資料夾名稱輕鬆識別內容。

{
  "folders": [
    {
      // Source code
      "name": "Product",
      "path": "vscode"
    },
    {
      // Docs and release notes
      "name": "Documentation",
      "path": "vscode-docs"
    },
    {
      // Yeoman extension generator
      "name": "Extension generator",
      "path": "vscode-generator-code"
    }
  ]
}

這將導致以下資源管理器顯示

named folders

從上面的示例中可以看出,您可以為工作區檔案添加註釋。

工作區檔案還可以包含 settings 下的 **工作區** 全域性設定extensions 下的 **擴充套件推薦**,我們將在下面討論。

workspace file schema

常規 UI

編輯器

當您使用多根工作區時,VS Code UI 只有少量更改,主要是為了區分資料夾之間的檔案。例如,如果多個資料夾中的檔案存在名稱衝突,VS Code 將在選項卡式標題中包含資料夾名稱。

tabbed headers

如果您想始終在選項卡式標題中看到顯示的資料夾,您可以使用 workbench.editor.labelFormat 設定 的 "medium" 或 "long" 值來顯示資料夾或完整路徑。

"workbench.editor.labelFormat": "medium"

VS Code UI,例如 **開啟的編輯器** 和 **快速開啟** (⌘P (Windows, Linux Ctrl+P)) 列表,都包含資料夾名稱。

quick pick has folder name

如果您正在使用 檔案圖示主題 並且活動主題支援,您將看到一個特殊的工作區圖示。

下面您可以看到內建的 **Minimal (Visual Studio Code)** 檔案圖示主題的工作區圖示。

custom workspace icon

VS Code 的全域性搜尋等功能會搜尋所有資料夾,並將搜尋結果按資料夾分組。

multi-root search results

當您有一個開啟的多根工作區時,您可以透過在 **要包含的檔案** 框中使用 ./ 語法來選擇在單個根資料夾中搜索。例如,如果您輸入 ./project1/**/*.txt,它將在 project1/ 根資料夾下搜尋所有 .txt 檔案。

設定

在一個工作區中擁有多個根資料夾時,每個根資料夾中可能都有一個 .vscode 資料夾,定義了適用於該資料夾的設定。為了避免設定衝突,在使用多根工作區時,僅應用資源 (檔案、資料夾) 設定。影響整個編輯器的設定 (例如,UI 佈局) 將被忽略。例如,兩個專案不能同時設定縮放級別。

使用者設定與單資料夾專案一樣得到支援,您還可以設定全域性工作區設定,這些設定將應用於多根工作區中的所有資料夾。全域性工作區設定將儲存在您的 .code-workspace 檔案中。

{
  "folders": [
    {
      "path": "vscode"
    },
    {
      "path": "vscode-docs"
    },
    {
      "path": "vscode-generator-code"
    }
  ],
  "settings": {
    "window.zoomLevel": 1,
    "files.autoSave": "afterDelay"
  }
}

當您從單資料夾例項切換到多資料夾例項時,VS Code 會將第一個資料夾中適當的編輯器範圍設定新增到新的全域性工作區設定中。

您可以透過設定編輯器輕鬆檢視和修改不同的設定檔案。設定編輯器的選項卡允許您選擇您的使用者設定、全域性工作區設定和單個資料夾設定。

settings dropdown

您還可以使用以下命令開啟特定的設定檔案

  • 首選項:開啟使用者設定 - 開啟您的全域性使用者設定
  • 首選項:開啟工作區設定 - 開啟工作區檔案的設定部分。
  • 首選項:開啟資料夾設定 - 開啟活動資料夾的設定。

全域性工作區設定覆蓋使用者設定,資料夾設定可以覆蓋工作區或使用者設定。

不支援的資料夾設定

不支援的編輯器範圍的資料夾設定將在您的資料夾設定中顯示為灰色,並從 **預設資料夾設定** 列表中過濾掉。您還會在設定前面看到一個資訊圖示。

unsupported setting information

除錯

使用多根工作區時,VS Code 會跨所有資料夾搜尋 launch.json 除錯配置檔案,並以資料夾名稱作為字尾顯示它們。此外,VS Code 還會顯示在工作區配置檔案中定義的啟動配置。

debugging dropdown

上面的示例顯示了 TSLint 擴充套件 的除錯配置。有一個來自 tslint 擴充套件資料夾的 launch 配置,用於在 VS Code 擴充套件主機中執行該擴充套件;還有一個來自 tslint-server 資料夾的 attach 配置,用於將偵錯程式附加到正在執行的 TSLint 伺服器。

您還可以看到 vscode-tslint 工作區 中的三個用於資料夾的 **新增配置** 命令:tslinttslint-servertslint-tests。 **新增配置** 命令將開啟資料夾的 .vscode 子資料夾中現有的 launch.json 檔案,或者建立一個新檔案並顯示除錯配置模板下拉選單。

debugging template dropdown

配置中使用的 變數 (例如 ${workspaceFolder} 或現在已棄用的 ${workspaceRoot}) 是相對於它們所屬的資料夾解析的。可以透過將根資料夾的名稱附加到變數 (用冒號分隔) 來為每個工作區資料夾限定變數的範圍。

工作區啟動配置

工作區範圍的啟動配置儲存在工作區配置檔案(命令面板中的 **工作區:開啟工作區配置檔案**)的 "launch" 部分。

Workspace Settings

或者,可以透過啟動配置下拉選單中的 "Add Config (workspace)" 條目新增新的啟動配置。

Add Config

複合啟動配置可以透過名稱引用單個啟動配置,只要這些名稱在工作區內是唯一的,例如

  "compounds": [{
      "name": "Launch Server & Client",
      "configurations": [
        "Launch Server",
        "Launch Client"
      ]
  }]

如果單個啟動配置名稱不唯一,則可以使用更冗長的 "folder" 語法指定限定資料夾。

  "compounds": [{
      "name": "Launch Server & Client",
      "configurations": [
        "Launch Server",
        {
          "folder": "Web Client",
          "name": "Launch Client"
        },
        {
          "folder": "Desktop Client",
          "name": "Launch Client"
        }
      ]
  }]

除了 compounds 之外,工作區配置檔案中的 launch 部分還可以包含常規啟動配置。請確保所有使用的變數都明確限定到特定資料夾,否則它們對工作區無效。您可以在 變數參考 中找到更多關於顯式限定變數的詳細資訊。

這是一個啟動配置的示例,其中程式位於 "Program" 資料夾中,並且當單步執行時,"Library" 資料夾中的所有檔案都將被跳過。

"launch": {
  "configurations": [{
      "type": "node",
      "request": "launch",
      "name": "Launch test",
      "program": "${workspaceFolder:Program}/test.js",
      "skipFiles": [
        "${workspaceFolder:Library}/out/**/*.js"
      ]
  }]
}

任務

與 VS Code 搜尋除錯配置的方式類似,VS Code 還會嘗試從 gulp、grunt、npm 和 TypeScript 專案檔案中自動檢測工作區中所有資料夾的任務,並且還會搜尋 tasks.json 檔案中定義 的任務。任務的位置由資料夾名稱字尾指示。請注意,在 tasks.json 中定義 的任務必須是 2.0.0 版本。

tasks dropdown

從上面的 TSLint 擴充套件 工作區 示例中,您可以看到 tslinttslint-tests 資料夾中的 tasks.json 檔案中有兩個 **已配置任務**,以及許多自動檢測到的 npm 和 TypeScript 編譯器 **檢測到的任務**。

工作區任務配置

工作區範圍的任務儲存在工作區配置檔案(命令面板中的 **工作區:開啟工作區配置檔案**)的 "tasks" 部分。只有 "shell""process" 型別的任務可以在工作區配置檔案中定義。

原始碼管理

使用多根工作區時,有一個 **原始碼管理提供程式** 部分,當您有多個活動儲存庫時,它可以提供概述。這些可以由多個 SCM 提供程式貢獻;例如,您可以將 Git 儲存庫與 Azure DevOps Server 工作區並排存放。當您在此檢視中選擇儲存庫時,您可以在下方看到原始碼管理詳細資訊。

multiple scm providers

您可以使用 Ctrl+ClickShift+Click 來選擇多個儲存庫。它們的詳細資訊將顯示在下方的單獨區域中。

擴充套件

如果您是擴充套件作者,您可以查閱我們的 採用多根工作區 API 指南,瞭解 VS Code 的多根工作區 API 以及如何使您的擴充套件在多個資料夾中正常工作。

以下是一些已採用多根工作區 API 的流行擴充套件。

注意:如果擴充套件尚不支援多個資料夾,它仍將在多根工作區的第一個資料夾中工作。

擴充套件建議

VS Code 支援透過資料夾的 .vscode 子資料夾下的 extensions.json 檔案進行資料夾級別的擴充套件推薦。您還可以透過將其新增到 .code-workspace 檔案來提供全域性工作區擴充套件推薦。您可以使用 **擴充套件:配置推薦的擴充套件 (工作區資料夾)** 命令開啟您的工作區檔案,並將擴充套件識別符號 ({publisherName}.{extensionName}) 新增到 extensions.recommendations 陣列。

{
  "folders": [
    {
      "path": "vscode"
    },
    {
      "path": "vscode-docs"
    }
  ],
  "extensions": {
    "recommendations": ["eg2.tslint", "dbaeumer.vscode-eslint", "esbenp.prettier-vscode"]
  }
}

後續步驟

  • 什麼是 VS Code "工作區"? - 更多關於單資料夾和多根工作區的資訊。
  • 除錯 - 瞭解如何為你的應用程式設定除錯。
  • 任務 - 任務允許您在 VS Code 中執行外部工具,如編譯器。

常見問題

如何回到處理單個專案資料夾?

您可以關閉工作區並直接開啟資料夾,或從工作區中刪除資料夾。

作為擴充套件作者,我需要做什麼?

請參閱我們的 採用多根工作區 API 指南。大多數擴充套件可以輕鬆支援多根工作區。

© . This site is unofficial and not affiliated with Microsoft.