參加你附近的 ,瞭解 VS Code 中的 AI 輔助開發。

2021 年 5 月(版本 1.57)

更新 1.57.1:此更新解決了這些問題

工作區信任功能解決了 CVE-2021-34529

下載:Windows:x64 Arm64 | Mac:通用 Intel Apple 晶片 | Linux:deb rpm tarball Arm snap


歡迎使用 Visual Studio Code 2021 年 5 月版本。此版本中有許多更新,我們希望您會喜歡,其中一些主要亮點包括:

如果您想線上閱讀這些發行說明,請訪問 code.visualstudio.com 上的更新頁面。

在 VS Code 團隊的釋出派對中觀看此版本新功能的亮點。您可以在我們的 YouTube 頻道上找到活動錄影

內測版:想盡快嘗試新功能?您可以下載每晚的內測版構建,並儘快嘗試最新的更新。

工作臺

工作區信任

Visual Studio Code 重視安全性,並希望幫助您安全地瀏覽和編輯程式碼,無論其來源或作者是誰。工作區信任功能可讓您決定專案資料夾是否應允許或限制自動程式碼執行。

Trust this folder dialog

注意:如有疑問,請將資料夾保留在受限模式。您可以隨時在以後啟用信任

安全的程式碼瀏覽

公共倉庫和檔案共享上有如此多的原始碼可供使用,這很棒。無論編碼任務或問題是什麼,很可能已經有很好的解決方案可用。然而,使用開原始碼和工具確實存在風險,您可能會面臨惡意程式碼執行和漏洞的風險。

當工作區在受限模式下開啟時,工作區信任透過阻止自動程式碼執行,在處理不熟悉的程式碼時提供額外的安全層。

注意:如果您想停用工作區信任功能,可以將 security.workspace.trust.enabled 設定為 false。只有在您確信瞭解您正在處理的檔案的來源和完整性時,才停用工作區信任。

受限模式

當工作區信任對話方塊提示時,如果您選擇否,我不信任作者,VS Code 將進入受限模式以防止程式碼執行。工作臺頂部將顯示一個橫幅,其中包含透過工作區信任編輯器管理您的資料夾的連結,以及帶您到工作區信任使用者指南的瞭解更多連結。

Workspace Trust Restricted Mode banner

您還會在狀態列中看到一個受限模式徽章。

Workspace Trust Restricted Mode Status bar badge

受限模式試圖透過停用或限制多個 VS Code 功能(任務、除錯、工作區設定和擴充套件)的操作來防止自動程式碼執行。

要檢視受限模式中停用的完整功能列表,您可以透過橫幅中的管理連結或單擊狀態列中的受限模式徽章來開啟工作區信任編輯器。

Workspace Trust editor

信任工作區

如果您信任專案的作者和維護者,您可以信任本地計算機上的專案資料夾。例如,通常可以安全地信任來自 github.com/microsoft 或 github.com/docker 等知名 GitHub 組織的倉庫。當您開啟新資料夾時,初始的工作區信任提示允許您信任該資料夾及其子資料夾。

您還可以調出工作區編輯器並快速切換資料夾的信任狀態。有幾種方法可以調出工作區編輯器對話方塊。

在受限模式下

  • 受限模式橫幅管理連結
  • 受限模式狀態列項

您也可以隨時使用

  • 工作區:管理工作區信任命令(來自命令面板)(⇧⌘P(Windows、Linux Ctrl+Shift+P
  • 活動欄中管理齒輪中的管理工作區信任

Manage Workspace Trust command in the Manage gear context menu

選擇資料夾

當您信任一個資料夾時,它會被新增到工作區信任編輯器中顯示的受信任資料夾和工作區列表。

Workspace Trust editor Trusted Folders and Workspaces list

您可以手動從此列表中新增、編輯和刪除資料夾,並且啟用信任的活動資料夾會以粗體顯示。

您還可以選擇信任父資料夾。這將對父資料夾和所有子資料夾應用信任。如果您在單個資料夾下有許多包含受信任內容的資料夾,這會很有幫助。

啟用擴充套件

如果您想使用受限模式,但您最喜歡的擴充套件不支援工作區信任,會發生什麼?這可能會發生,如果一個擴充套件雖然有用且功能正常,但沒有積極維護並且沒有宣告其工作區信任支援。為了處理這種情況,您可以使用 extensions.supportUntrustedWorkspaces 設定覆蓋擴充套件的信任狀態。

注意:覆蓋擴充套件的工作區信任支援時要小心。可能擴充套件作者有充分的理由在受限模式下停用他們的擴充套件。

下面您可以看到 Prettier 擴充套件的使用者 settings.json 條目。

  "extensions.supportUntrustedWorkspaces": {
    "esbenp.prettier-vscode": {
      "supported": true,
      "version": "6.4.0"
    },
  },

您可以使用 supported 屬性啟用或停用工作區信任支援。version 屬性指定適用的確切擴充套件版本,如果您想為所有版本設定狀態,則可以刪除版本欄位。

如果您想了解更多關於擴充套件作者如何評估和確定在受限模式下限制哪些功能的資訊,您可以閱讀工作區信任擴充套件指南

設定

以下是可用的工作區信任設定:

  • security.workspace.trust.enabled - 啟用工作區信任功能。預設為 true。
  • security.workspace.trust.startupPrompt - 是否在啟動時顯示工作區信任對話方塊。預設為每個不同的資料夾或工作區只顯示一次。
  • security.workspace.trust.emptyWindow - 是否始終信任空視窗(沒有開啟的資料夾)。預設為 true。
  • security.workspace.trust.untrustedFiles - 控制如何處理工作區中的散檔案。預設為提示。
  • extensions.supportUntrustedWorkspaces - 覆蓋擴充套件工作區信任宣告。可以是 true 或 false。

要了解有關工作區信任的更多資訊,您可以閱讀工作區信任使用者指南。

全新的入門體驗

在過去的幾次迭代中,我們一直在努力重新整理 VS Code 的歡迎頁面,我們很高興地宣佈,從本次迭代開始,我們的新歡迎頁面(入門)預設對所有使用者啟用。在這種新體驗中,VS Code 核心和已安裝的擴充套件都可以向歡迎頁面貢獻“演練”,這些演練旨在幫助您開始使用 VS Code 本身或新的擴充套件。例如,Luna Paint 擴充套件貢獻了一個演練,其中包含幫助理解影像編輯器每個元件的指南。

New welcome page, showing some of the walkthroughs core and extensions can contribute

此外,一旦您完成(或關閉)所有演練,VS Code 會重新排列內容,使可一鍵訪問的最近工作區數量翻倍。

New welcome page with all walkthroughs dismissed, showing extra recent workspaces entries

設定

  • workbench.startupEditor - 控制啟動時顯示的預設編輯器。新值 gettingStarted 替換了舊預設值 welcome。其他一些可用選項包括 readmegettingStartedInEmptyWorkbenchnewUntitledFilenone
  • workbench.welcomePage.walkthroughs.openOnInstall - 是否在安裝時自動開啟擴充套件貢獻的演練。

在新舊歡迎頁面完全過渡之前,新頁面將被稱為入門

遠端倉庫

遠端倉庫擴充套件在 1.56 中作為內建預覽功能引入,現在已公開發布,但它不再內置於 VS Code 中,因此您需要從 VS Code Marketplace 安裝它。

簡單回顧一下,遠端倉庫擴充套件允許您直接在 VS Code 中即時瀏覽、搜尋、編輯和提交到任何 GitHub 倉庫,而無需克隆或在本地擁有該倉庫。

在此迭代中,雖然我們主要專注於錯誤修復和完善擴充套件以供釋出,但我們確實添加了一些新功能。您現在可以在遠端資源管理器中檢視您的遠端倉庫,以快速開啟或比較您可能有的任何未提交的更改。此外,您可以將來自同一倉庫的更改應用到當前遠端倉庫,從而允許您快速輕鬆地將未提交的更改從一個分支移動到另一個分支。

Remote Repositories Remote Explorer view

主題:紫水晶暗色主題

要了解有關遠端倉庫的更多資訊,您可以檢視遠端倉庫部落格文章YouTube 影片

改進的跨視窗編輯器拖放

此版本改進了將編輯器拖到其他視窗的支援。您現在可以將差異編輯器、自定義編輯器和整個編輯器組拖到另一個視窗以在那裡開啟編輯器。

Improved editor drag and drop across windows

主題:GitHub Light Theme

注意:如果您經常使用此功能,請確保啟用自動儲存(files.autoSave),以便在一個視窗中的更改自動反映在另一個視窗中。

移除 Cmd+W / Ctrl+W 關閉視窗鍵繫結(當沒有編輯器開啟時)

我們收到了反饋,使用者對透過快速使用 Cmd+W / Ctrl+W 關閉最後一個編輯器後,VS Code 視窗(例項)突然關閉感到沮喪。團隊的快速民意調查也顯示,許多人已經取消了此鍵繫結以關閉視窗,因此我們繼續並移除了 Cmd+W / Ctrl+W 作為當沒有編輯器開啟時關閉視窗的鍵繫結。

您可以透過在使用者 keybindings.json 檔案中按如下方式配置來輕鬆恢復鍵繫結:

macOS

{
  "key": "cmd+w",
  "command": "workbench.action.closeWindow",
  "when": "!editorIsOpen && !multipleEditorGroups"
}

Windows/Linux

{
  "key": "ctrl+w",
  "command": "workbench.action.closeWindow",
  "when": "!editorIsOpen && !multipleEditorGroups"
}

注意:在所有平臺上,都有一個專門分配的鍵繫結來關閉視窗。

  • macOS:Cmd+Shift+W
  • Linux:Alt+F4
  • Windows:Alt+F4

Notebook 佈局自定義

本月我們添加了幾個 Notebook 佈局設定,允許使用者根據其工作流自定義 Notebook 編輯器。預設啟用的自定義包括:

Notebook 工具欄

我們在編輯器中添加了一個 Notebook 工具欄,您可以在其中輕鬆訪問插入單元格、執行所有單元格或切換核心等操作。透過將 notebook.globalToolbar 設定為 false 可以停用工具欄。

Notebook toolbar

輸出工具欄

清除單元格輸出操作和選擇不同輸出渲染器或 MIME 型別的按鈕現在合併到單元格輸出旁邊的單個...省略號選單中。透過將 notebook.consolidatedOutputButton 設定為 false 可以停用此功能。

Notebook output toolbar

聚焦單元格的側邊欄高亮

VS Code 現在支援在單元格的側邊欄區域渲染聚焦單元格高亮,這有助於在 Notebook 包含許多單元格時識別哪個單元格處於聚焦狀態。設定 notebook.cellFocusIndicator 可以是 gutter(新預設值),也可以是 border 來高亮整個單元格邊框。

Notebook focus indicator on gutter

滑鼠懸停時顯示摺疊圖示

Markdown 單元格上的摺疊圖示現在在滑鼠懸停時可見,而不是始終可見。您可以透過將 notebook.showFoldingControls 設定為 mouseover(預設)或 always 來自定義行為。

Notebook show focus icon on mouse over

本月實現的 Notebook 佈局設定完整列表如下:

  • notebook.cellFocusIndicator:添加了選項,讓單元格可以透過單元格側面(gutter)的彩色條指示其聚焦狀態,類似於 Jupyter。
  • notebook.cellToolbarVisibility:確定單元格工具欄何時顯示,是在單元格聚焦時還是懸停時。預設情況下,只在單元格聚焦時顯示。
  • notebook.compactView:啟用後,單元格以更緊湊的樣式渲染,減少空白區域。預設情況下啟用。
  • notebook.consolidatedOutputButton清除單元格輸出操作和選擇不同輸出渲染器或 MIME 型別的按鈕已合併到單元格輸出旁邊的單個...省略號選單中。可以透過此設定停用新選單。
  • notebook.consolidatedRunButton:新增了兩個操作:執行上方單元格執行當前及下方單元格。它們預設會出現在單元格工具欄中,但啟用此設定會將它們移動到執行按鈕旁邊的新上下文選單中。
  • notebook.dragAndDropEnabled:停用單元格的拖放。您仍然可以使用命令(預設是Alt+Up/Alt+Down)重新排列單元格。
  • notebook.globalToolbar:在 Notebook 編輯器頂部新增一個工具欄。
  • notebook.insertToolbarLocation:控制插入新單元格的按鈕是出現在單元格之間、工具欄中、兩者都出現還是隱藏。
  • notebook.showCellStatusBar:此設定有一個新選項 visibleAfterExecute,它將隱藏單元格狀態列以節省空間,直到單元格執行。一旦執行,它將變為可見,以便使用者可以檢視執行詳細資訊。
  • notebook.showFoldingControls:控制 Markdown 標題上出現的摺疊箭頭是始終可見,還是僅在滑鼠懸停時可見。
  • notebook.editorOptionsCustomizations:允許使用者自定義 Notebook 中的單元格編輯器設定。

下圖顯示了其中幾個設定的效果(頂部工具欄、側邊欄高亮、輸出...按鈕)

Notebook layout changes

更新了快速選擇和建議小部件顏色

我們更新了快速選擇和建議小部件中的焦點狀態,以更好地與我們的樹小部件樣式對齊。這引入了一些控制焦點前景的新顏色標記:

  • list.focusHighlightForeground
  • quickInputList.focusForeground
  • editorSuggestWidget.selectedForeground

Quick Pick style in light theme

Suggest style in light theme

圖示主題:Fluent Icons

更新了 macOS 的觸控欄圖示

我們更新了 macOS 觸控欄圖示,使其與我們更新後的圖示樣式保持一致。

macOS 觸控欄圖示 預設檢視

macOS 觸控欄圖示(除錯時帶更多控制元件) 除錯時

Webview 的上下文選單

VS Code 現在支援在 webview 內部顯示簡單的上下文選單,例如 Markdown 預覽、釋出說明和擴充套件詳細資訊頁面。

A context menu in a webview

此上下文選單目前包含複製和貼上文字的操作。我們將來可能會向選單新增更多操作。

如果此上下文菜單幹擾了您的擴充套件中的 webview,您可以透過在 contextmenu 事件上呼叫 preventDefault 來阻止它顯示。

document.body.addEventListener('contextmenu', e => {
  e.preventDefault(); // cancel the built-in context menu
});

編輯器

建議預覽

啟用新設定 editor.suggest.preview 後,所選建議或程式碼片段的預覽將顯示在游標位置。

Suggestion preview showing smart completions for the letter 'i'

主題:深色+(預設深色)

隱藏已棄用的建議

有一個新設定 editor.suggest.showDeprecated,預設為 on,但當設定為 off 時,建議將不會顯示標記為已棄用的項。

整合終端

終端標籤頁

終端標籤頁在1.56 中作為預覽功能引入,現在預設啟用。新的標籤檢視預設只會在至少有兩個終端時顯示。對於單個終端,標籤會“內聯”到面板標題中。這也引入了終端狀態的概念,例如任務是否正在執行、成功或失敗。

Single inlined terminal tab, terminal tabs with status, and collapsed terminal tabs

以下是此版本的一些亮點:

  • 標籤頁的顏色可以更改,以便快速導航和區分。
  • 標籤頁可以拖放以進行重新排列。
    drag and drop
  • 將終端組中的標籤頁拖到空白區域會將其從組中移除(取消拆分終端,也可透過上下文選單獲得)。
    unsplit
  • 將標籤頁拖到主終端區域允許加入一個組(也可透過上下文選單獲得)。
    dragging a terminal tab to join a tab group
  • 點選標籤頁、+按鈕或單個標籤頁時,Alt現在會拆分終端。對於滑鼠中鍵點選關閉終端也一樣。
    split terminal buttons
  • 除非標籤列表足夠大以避免意外拆分/關閉終端,否則不會顯示內聯操作。
  • 當關閉終端只剩一個時,標籤列表不會隱藏,直到滑鼠離開檢視。

如果您不喜歡新的使用者體驗,可以透過設定 "terminal.integrated.tabs.enabled": false 返回到下拉列表,我們計劃繼續支援此選項。

終端配置檔案改進

終端配置檔案系統在此版本中進行了許多改進,以下是一些亮點:

  • 如果終端在啟動 VS Code 時恢復,則會遵守 defaultProfile,並將其用於任務和除錯。
  • IntelliSense 現在在 settings.json 中適用於 icondefaultProfile
  • overrideName 現在適用於預設配置檔案。
  • defaultProfile 現在可以在工作區設定中設定。這現在也由新的工作區信任功能控制。
  • 如果使用 defaultProfileshellshellArgs 設定,您現在將被要求將已棄用的設定遷移到配置檔案系統。
  • color 現在可以在配置檔案上設定。

標題序列支援

設定 terminal.integrated.experimentalUseTitleEvent 已升級為穩定版,名稱為 terminal.integrated.titleMode。預設情況下,此設定為 executable,它根據檢測到的前臺程序命名終端。

Running 'git show' will result in the terminal's title changing to 'git'

當此設定為 sequence 時,標題將基於 shell 設定的標題。這需要 shell 支援才能工作,一個示例是 oh-my-zsh 的預設提示,它顯示了有關會話的額外資訊。

The oh-my-zsh default prompt will show the computer's name and current working directory

改進了使用乾淨環境啟動

設定 terminal.integrated.inheritEnvv1.36 起就已提供,但其實現存在一些缺陷,例如在 Linux 上可能會因許可權問題而失敗,並且在 macOS 上可能無法按預期工作。

由於 VS Code 設定其底層環境的方式有所改進,現在可以訪問它啟動時使用的初始環境,這是大多數終端的工作方式。當 inheritEnv 設定為 true 時,VS Code 現在將使用初始環境,而當 false 時,將使用源化的“shell 環境”。此設定可以幫助終端更像常規終端。但是,如果您的配置檔案/rc 配置設定不正確,您可能會遇到問題。

Windows 上原生換行支援

終端中的換行驅動著任務問題匹配器和連結檢測。歷史上,Windows 終端一直使用啟發式方法將行標記為換行,因為模擬 Unix pty 的模擬技術不支援換行。這種情況在最近的 Windows 版本中發生了變化,當更新到 Windows 10 21376+(目前僅限 Insider 版本)時,此啟發式方法將被停用,並且換行應該像在 Windows Terminal 中一樣正常工作。

任務

終端標籤頁上的任務狀態

任務的狀態現在顯示在其終端標籤頁中。對於後臺任務,狀態僅在有相關問題匹配器時顯示。

Task status on a terminal tab

自動關閉任務終端

任務 presentation 屬性有一個新的 close 屬性。將 close 設定為 true 將導致任務退出時終端關閉。

{
  "type": "shell",
  "command": "node build/lib/preLaunch.js",
  "label": "Ensure Prelaunch Dependencies",
  "presentation": {
    "reveal": "silent",
    "close": true
  }
}

除錯

JavaScript 除錯

像往常一樣,完整的更改列表可以在 vscode-js-debug 變更日誌中找到。

Edge 開發人員工具整合

JavaScript 偵錯程式與 Microsoft Edge 開發人員工具整合,為瀏覽器除錯提供 DOM、樣式和網路檢查器,可透過除錯工具欄中的新“檢查”圖示訪問。

Debugger inspect button

下面的短影片演示了選擇“檢查”按鈕並在 Edge DevTools 中導航元素。

演示點選“檢查”圖示並在 Edge 中點選元素 主題:Codesong

如果您尚未將 Microsoft Edge 用於瀏覽器除錯,您可以透過在 launch.json 中將 "type": "chrome""type": "pwa-chrome" 替換為 "type": "pwa-msedge" 來切換到它。這在 Blazor 應用程式中也受支援,方法是在其啟動配置中設定 "browser": "edge"

支援源對映中重新命名的識別符號

JavaScript 偵錯程式現在支援源對映中重新命名的識別符號,這是一項長期請求的功能。這在除錯縮小程式碼時特別有用。

在斷點處暫停的螢幕截圖。正在執行縮小程式碼,但變數、監視和除錯控制檯檢視顯示可以透過原始名稱訪問變數。 主題:Codesong

變數檢視、監視檢視和除錯控制檯 REPL 都支援重新命名的變數。您可以透過檢視生成的源對映檔案中是否存在非空的“names”陣列來檢查您的工具是否發出了重新命名。

在 BREAKPOINTS 檢視中顯示命中的斷點

當命中斷點時,VS Code 現在會在 BREAKPOINTS 檢視中選擇並顯示它。這應該有助於更容易地理解是哪個確切的斷點導致程式中斷。

目前只有 JS-debug 擴充套件支援此功能,但我們預計其他除錯擴充套件也將很快支援。

As the user steps in the program, a breakpoint that got hit is selected and revealed in the BREAKPOINTS view

語言

TypeScript 4.3.2

VS Code 現在隨附 TypeScript 4.3.2。此主要更新包括許多 TypeScript 語言改進,以及 JavaScript 和 TypeScript 工具的許多改進和錯誤修復。

您可以在TypeScript 部落格上閱讀有關 TypeScript 4.3 的更多資訊。

VS Code 現在支援 JavaScript 和 TypeScript 註釋中的 JSDoc @link 標籤。這些標籤允許您在文件中建立可點選的符號連結。

Navigating code using JSDoc @link tags

JSDoc @link 標籤的寫法是:{@link symbolName}。您還可以選擇指定要渲染的文字來代替符號名稱:{@link class.property Alt text}

在懸停提示、建議和簽名幫助中都支援 @link。我們還更新了 VS Code 擴充套件性型別宣告檔案 vscode.d.ts 以使用 @link

匯入語句中的自動補全

JavaScript 和 TypeScript 中的自動匯入會在您接受建議時自動新增匯入。在 VS Code 1.57 中,它們現在在編寫匯入語句本身時也起作用。

Auto imports in an import statement

如果您需要手動新增匯入,這可以節省時間。

非 JS/TS 檔案的“轉到定義”

許多現代 JavaScript 打包工具和框架使用 import 語句匯入圖片和樣式表等資源。我們現在支援透過轉到定義導航這些匯入。

Navigating to a non-JS/TS import

當您使用 Ctrl/Cmd 點選導航程式碼時,這可能最有用。

排序匯入源操作

JavaScript 和 TypeScript 的排序匯入程式碼操作會對您的匯入進行排序。但是,與組織匯入不同,它不會刪除任何未使用的匯入。

您還可以透過設定在儲存時啟用匯入排序:

"editor.codeActionsOnSave": {
    "source.sortImports": true
}

推斷函式返回型別快速修復

TypeScript 的推斷函式返回型別重構會向函式新增顯式返回型別註解。

The Infer function return type refactoring in action

如果您想新增更明確的型別,這會很有用。當您想將返回型別提取到命名型別/介面,或者需要修改函式的返回型別時,此重構也可以節省時間。

提示停用 TS 伺服器日誌

如果 TypeScript 伺服器日誌長時間啟用,VS Code 現在會提示您。

TS server logging enabled notification

日誌記錄會顯著影響效能,因此最好將其停用,除非您正在積極診斷問題。

對擴充套件的貢獻

遠端開發

遠端開發擴充套件的工作仍在繼續,它允許您使用容器、遠端機器或 適用於 Linux 的 Windows 子系統 (WSL) 作為功能齊全的開發環境。

1.57 版本的主要功能亮點包括:

  • 控制轉發埠的所需協議。
  • 可選地監視轉發埠衝突。
  • 開發容器支援工作區信任安全功能。
  • 更好地檢測開發容器中的環境變數。

您可以在遠端開發發行說明中瞭解有關新擴充套件功能和錯誤修復的資訊。

擴充套件創作

Notebook API

我們已經最終確定了大部分 Notebook API。該 API 分為三個獨立的部分:

  1. NotebookSerializer API,與 notebooks 貢獻點結合使用,使 VS Code 能夠開啟、修改和儲存 Notebook 文件。
  2. Notebook 渲染器,用於呈現單元格輸出。它們透過擴充套件的 package.json 檔案的 notebookRenderer 貢獻點新增。
  3. NotebookController API,用於生成程式碼單元格的輸出。

一個簡單的 Notebook 序列化器和回顯控制器的示例。序列化器使用 JSON.parsestringify,並對空檔案進行特殊處理。控制器返回單元格文字的大寫變體 - 一次是純文字,一次是 HTML。

// serialize/deserialize notebook
vscode.workspace.registerNotebookSerializer(
  'echobook',
  new (class implements vscode.NotebookSerializer {
    // serializer is relying on JSON.parse/stringify
    deserializeNotebook(content: Uint8Array) {
      return JSON.parse(new TextDecoder().decode(content) || '{"cells":[]}');
    }
    serializeNotebook(data: vscode.NotebookData) {
      return new TextEncoder().encode(JSON.stringify(data));
    }
  })()
);

// notebook controller
vscode.notebooks.createNotebookController(
  'myId',
  'echobook',
  'Echo',
  (cells, _notebook, controller) => {
    for (let cell of cells) {
      // execution means to echo in upper-case, once as plain text and once as html
      const execution = controller.createNotebookCellExecution(cell);
      execution.start();
      const echo = cell.document.getText().toUpperCase();
      const textItem = vscode.NotebookCellOutputItem.text(echo, 'text/plain');
      const htmlItem = vscode.NotebookCellOutputItem.text(`<b>${echo}</b>`, 'text/html');
      const output = new vscode.NotebookCellOutput([textItem, htmlItem]);
      execution.replaceOutput(output);
      execution.end(true);
    }
  }
);

該示例靜態地為 *.echobook 檔案註冊了 Notebook 型別。此外,每當開啟此類 Notebook 時,VS Code 都會發出 onNotebook:echobook 啟用事件。

"contributes": {
  "notebooks": [{
      "type": "echobook",
      "displayName": "Echobook",
      "selector": [{
        "filenamePattern": "*.echobook"
      }]
  }]
}

狀態列項“id”和“name”屬性

我們最終確定了 StatusBarItem 識別符號和名稱屬性的 API。識別符號可以從 createStatusBarItem 方法的新過載傳遞,而 name 屬性可以在 StatusBarItem 本身動態更改。

這些新屬性用於狀態列上的上下文選單,以便為單個條目提供名稱,並允許使用者顯示和隱藏條目。如果您不提供這些屬性,選單將把來自一個擴充套件的所有狀態條目聚合到一個條目下。

Status bar item menu

如果您的擴充套件貢獻了狀態列,請考慮更新到新的 API。

在新終端中列印訊息

在使用 window.createTerminal 建立終端時,現在可以透過 TerminalOptions.message 設定一條訊息,該訊息將列印在終端的頂部。此訊息支援 ANSI 轉義序列以啟用文字樣式。

vscode.window.createTerminal({
  name: `My terminal`,
  message: '\x1b[3;1mSome custom message\x1b[0m'
});

Terminal displaying a custom message

內聯值的新主題顏色

添加了新的顏色來主題化偵錯程式內聯值:

  • editor.inlineValuesBackground:除錯內聯值前景色文字的顏色。
  • editor.inlineValuesForeground:除錯內聯值背景的顏色。

提醒一下,當註冊了內聯值提供程式的除錯擴充套件或設定 debug.inlineValuestrue 時,在除錯期間會顯示內聯值。

Debug inline values are shown with the foreground and background color customized

vscode-webview.d.ts

新發布的 @types/vscode-webview 包添加了 VS Code 在 webview 內部公開的 API 的型別定義。

您可以使用 npm install --save-dev @types/vscode-webview 安裝這些型別。如果您的專案中未識別 webview 型別,請嘗試將它們新增到 jsconfig / tsconfigtypeAcquisition 部分。

"typeAcquisition": {
  "include": [
    "@types/vscode-webview"
  ]
}

或者在您的程式碼中新增三斜槓引用:

///<reference types="@types/vscode-webview"/>

改進了 webview 陣列緩衝區傳輸

在以前的 VS Code 版本中,向 webview 傳送或從 webview 接收型別化陣列有一些奇怪之處:

  • 型別化陣列(例如 UInt8Array)序列化效率低下。當您需要傳輸數兆位元組的資料時,這可能會導致效能問題。
  • 傳送的型別化陣列在接收端不會以正確的型別重新建立。如果您傳送 UInt8Array,接收者會得到一個通用物件,該物件包含 UInt8Array 的資料值。

雖然這兩個問題都是錯誤,但如果我們不解決它們,可能會破壞依賴現有行為的擴充套件。同時,新編寫的擴充套件完全沒有理由想要當前這種令人困惑且效率低下的行為。

因此,我們決定保留現有擴充套件的現有行為,但讓新擴展采用更正確的行為。這是透過檢視擴充套件的 package.json 中的 engines 值來完成的。

"engines": {
  "vscode": "^1.57.0",
}

如果擴充套件針對 VS Code 1.57+,那麼型別化陣列應該在接收端重新建立,並且大型型別化陣列與 webview 之間的傳輸應該效率得多。

除錯會話上的 parentSession

前段時間,VS Code 添加了對分層除錯會話的支援,但在擴充套件 API 中沒有公開有關層次結構的資訊。為了解決這個問題,DebugSession 介面上有一個新屬性,它引用了父會話(如果有)。會話的父會話永遠不會改變。

export interface DebugSession {
  /**
    * The parent session of this debug session, if it was created as a child.
    * @see DebugSessionOptions.parentSession
    */
  readonly parentSession?: DebugSession;

  // ...

改進了 VS Code Insiders 版本定位

在開發使用提案 API 的擴充套件時,可能會發布新的 Insiders 版本,其中包含重大更改。為了為使用者提供更無縫的過渡,您現在可以使用日期標籤精確地定位 Insiders 版本。例如,將 engines.vscode 設定為 ^1.56.0-20210428 將定位在 2020 年 4 月 28 日 0:00 UTC 或之後建立的任何 VS Code 1.56(或更高版本)版本。這允許您在即將釋出的 Insiders 版本釋出之前安全地釋出過期擴充套件更新。

"engines": {
  "vscode": "^1.56.0-20210428",
}

樹形懸停支援命令 URI

TreeItem 具有受信任的 Markdown 工具提示時,該工具提示可以包含格式為 [這是一個連結](command:workbench.action.quickOpenView) 的命令。這與其他所有支援 Markdown 命令連結的地方遵循相同的格式。

建議的擴充套件 API

每個里程碑都會帶來新的提議 API,擴充套件作者可以嘗試使用它們。一如既往,我們希望得到您的反饋。要嘗試提議的 API,您需要執行以下操作:

  • 您必須使用 Insiders 版本,因為提議的 API 經常更改。
  • 您的擴充套件的 package.json 檔案中必須包含以下行:"enableProposedApi": true
  • 將最新版本的 vscode.proposed.d.ts 檔案複製到您專案的源位置。

您不能釋出使用提議 API 的擴充套件。下個版本中可能會有破壞性更改,我們絕不希望破壞現有擴充套件。

測試

我們本打算在此迭代中最終確定測試 API 的第一部分,但由於其他正在進行的功能數量眾多而推遲了。儘管此迭代中測試 API 沒有破壞性更改,但我們繼續在其編輯器體驗方面取得進展。例如,“檢視”檢視獲得了分屏檢視,允許您瀏覽當前和過去測試執行的結果。

一個檢視檢視的圖片,其中分屏檢視的右側顯示了一個引用式樹 主題:Codesong

測試獲得了一組以 Ctrl+; 開頭的新組合鍵繫結,“檢視”檢視現在更好地支援 Markdown 訊息,並且修復了許多錯誤。

如果您使用 Test Explorer UI 擴充套件進行測試,您可以啟用設定 testExplorer.useNativeTesting 以切換到新的原生 UI。在下一次迭代中,我們計劃增加此設定的社交化,並開始與合作伙伴擴展團隊一起採用。

終端配置檔案貢獻

此 API 將使擴充套件能夠貢獻終端配置檔案系統。擴充套件需要做幾件事才能使其正常工作。首先在 package.json 中貢獻配置檔案:

"contributes": {
  "terminal": {
    "profiles": [
      {
        "title": "Profile from extension",
        "id": "my-ext.terminal-profile",
        "icon": "lightbulb"
      }
    ]
  },
}

然後在新 onTerminalProfile 啟用事件上啟用擴充套件:

"activationEvents": [
  "onTerminalProfile:my-ext.terminal-profile"
]

最後,在啟用事件中註冊提供程式:

vscode.window.registerTerminalProfileProvider('my-ext.terminal-profile', {
  provideProfileOptions(token) {
    return {
      name: 'Profile from extension',
      shellPath: 'cmd.exe'
    };
  }
});

如果啟用了建議的 API,則擴充套件貢獻的配置檔案應該會顯示在配置檔案列表中。

Extension contributed profile is displayed in the profiles list

terminal options 中的 iconPath 支援

TerminalOptionsTerminalExtensionOptions 支援標準 iconPath 型別,以設定終端圖示,該圖示顯示在終端的標籤頁上。

readonly iconPath?: Uri | { light: Uri; dark: Uri } | ThemeIcon;

更改偽終端標題

新事件 Pseudoterminal.onDidChangeName 啟用了對基於偽終端的終端的控制。

const writeEmitter = new EventEmitter<string>();
const nameEmitter = new EventEmitter<string>();
const pty = {
  onDidWrite: writeEmitter.event,
  open: () => writeEmitter.fire('Type to change the title of the terminal'),
  close: () => {
    /* noop*/
  },
  handleInput: (data: string) => nameEmitter.fire(data)
};
const terminal = vscode.window.createTerminal({
  name: `My Terminal`,
  pty
});
terminal.show();

使檔案系統提供程式能夠將檔案宣告為只讀

檔案系統提供程式現在可以透過 FileStat 上的新 permissions 屬性,將單個檔案標記為只讀,方法是將該屬性的值設定為 FilePermission.Readonly。只讀檔案不可編輯。

注意:如果所有檔案都應被視為只讀,您可以在呼叫 registerFileSystemProvider 時使用現有的 isReadonly 選項。

支援 asExternalUri 中的工作區 URI

現有的 vscode.env.asExternalUri API 現在支援處理工作區 URI。這允許擴充套件作者建立直接開啟給定工作區的系統範圍 URI。

例如

const uri = await vscode.env.asExternalUri('file:///Users/john/work/code');

生成的 uri 可以由作業系統開啟,並且 VS Code 將開啟該工作區。

工程

Electron 沙盒支援的進展

在這個里程碑中,我們繼續為 VS Code 視窗做準備,以啟用 Electron 的 沙盒上下文隔離功能。

具體來說:

  • 我們從渲染器中使用的更多程式碼中移除了 Node.js 依賴項。
  • 我們繼續研究完全放棄 webview 使用,併為我們的自定義檢視和編輯器切換到 iframe

文件

Build 2021 上的 VS Code

如果您錯過了 Microsoft Build 2021 開發者活動,您仍然可以觀看點播會話。檢視Build 2021 上的 Visual Studio Code 部落格文章,我們在其中整理了一份我們認為 VS Code 使用者會感興趣的會話列表。

What's New in VS Code Build 2021 session on YouTube

瀏覽器除錯

一個新主題 VS Code 中的瀏覽器除錯描述了 Edge 和 Chrome 瀏覽器內建的除錯支援。您可以配置 VS Code 以啟動新的瀏覽器除錯會話(透過除錯:開啟連結命令)或附加到正在執行的瀏覽器。

PyTorch

有一個新主題,介紹瞭如何在 VS Code 中使用 PyTorch 機器學習框架。在VS Code 中的 PyTorch 支援文章中,您將學習如何使用 PyTorch 和 TensorFlow 資料型別擴充套件 Jupyter Notebook。

PyTorch logo

值得注意的修復

  • 71966:經常出現整個視窗卡死
  • 85332:Windows:檔案刪除時凍結
  • 95077:終端“單詞”連結提供程式不支援換行
  • 108804:在開啟視窗之前不等待 shell 環境解析
  • 120004:VS Code 整合終端中的怪異字母間距
  • 125035:除錯控制檯篩選文字應在重新載入後保留
  • iOS/iPadOS:對 iOS/iPadOS 平臺進行了一些修復。

感謝

最後但同樣重要的是,衷心感謝以下本月為 VS Code 做出貢獻的人們:

對我們問題跟蹤的貢獻

vscode 的貢獻

vscode-css-languageservice 的貢獻

vscode-eslint 的貢獻

vscode-js-debug 的貢獻

vscode-languageserver-node 的貢獻

vscode-pull-request-github 的貢獻

vscode-vsce 的貢獻

language-server-protocol 的貢獻

monaco-languages 的貢獻

monaco-typescript 的貢獻