🚀 在 VS Code 中取得 ！

2022 年 9 月 (版本 1.72)

下載：Windows: x64 Arm64 | Mac: 通用 Intel silicon | Linux: deb rpm tarball Arm snap

更新 1.72.1：此更新解決了這些安全性問題。

更新 1.72.2：此更新解決了這些問題。

歡迎使用 Visual Studio Code 2022 年 9 月發行版本。此版本有許多更新，我們希望您會喜歡，其中一些重點包括

如果您想在線上閱讀這些發行說明，請前往 code.visualstudio.com 上的更新。

Insiders： 想要盡快試用新功能嗎？您可以下載每晚 Insiders 組建，並在最新更新可用時立即試用。

工作台

隱藏工具列中的動作

您現在可以隱藏工具列中的動作。在工具列中的任何動作上按一下滑鼠右鍵，然後選取其隱藏命令或任何切換命令。隱藏的動作會移至 ... 更多動作選單，並且可以從該處叫用。若要還原選單，請在工具列按鈕區域按一下滑鼠右鍵，然後選取 重設選單 命令。若要還原所有選單，請從命令面板執行 重設所有選單 (⇧⌘P (Windows、Linux Ctrl+Shift+P))。

在以下影片中，GitLens 擴充功能的 檔案註解 選單已從編輯器工具列中隱藏，然後透過 重設選單 還原。

合併編輯器

選擇加入以使用三向合併編輯器

在檢閱我們收到的所有合併編輯器意見反應並思考整體體驗後，我們決定在偵測到衝突時，預設不顯示三向合併編輯器 (git.mergeEditor 設定現在為 false)。此決策的原因可在 問題 #160806 中找到。

對於有衝突的檔案，使用者現在可以選取 在合併編輯器中解決 以開啟三向合併編輯器

A screenshot of a file with conflicts, showing the "Resolve in Merge Editor" button

CodeLens UI

使用者意見反應指出核取方塊有一些 UX 問題。核取方塊不容易探索，而且因為無法正確表示所有可能的狀態而造成混淆。在此反覆運算中，我們切換到使用文字標籤 (接受外部變更、接受目前變更、同時接受兩者) 的 CodeLens UI

Merge editor before with checkboxes and after with CodeLens

我們將繼續反覆運算此設計，並密切監控我們收到的所有意見反應。

從頭重新計算結果檔案

在上一個反覆運算中，我們嘗試將合併編輯器設計為具有衝突檔案的替代檢視。取代顯示衝突標記，個別的編輯器窗格顯示衝突的詳細資訊。此設計的優點是開啟合併編輯器不會修改磁碟上的檔案，而且可以在開啟合併編輯器之前保留使用者所做的變更。遺憾的是，這不僅令人困惑，而且在所有情況下都無法運作，因為我們的合併演算法和 Git 合併演算法並未完全對齊。

在此版本中，如果具有衝突標記的檔案在合併編輯器中開啟，則第一步，我們使用我們的合併演算法重新計算結果檔案，而不會插入任何衝突標記。單邊衝突會自動解決，而適當的衝突會重設為兩個版本的通用祖先，並標示為 未處理。

基準檢視

合併編輯器現在具有個別的基準檢視，可用於將任何一方與通用祖先進行比較。

樹狀檢視尋找控制項改進

您現在可以垂直移動樹狀檢視尋找控制項，以便存取其後方的 UI 元素。在樹狀檢視內按下 ⌥⌘F (Windows、Linux Ctrl+Alt+F) 以顯示尋找控制項。

Tree view Find control supports vertical movement

此外，樹狀檢視尋找控制項將記住重新開啟時的最後一個搜尋詞彙。

Tree view Find control remembers last search text

某些音訊和視訊檔案的內建預覽

VS Code 現在支援預覽某些音訊和視訊檔案格式

Previewing an MP4 video in VS Code

目前支援下列音訊格式

  • WAV
  • MP3
  • Ogg
  • FLAC

可以預覽下列視訊格式

  • H.264
  • VP8

對於視訊檔案，請記住，必須同時支援視訊和音訊軌的媒體格式。例如，許多 .mp4 檔案使用 H.264 進行視訊，並使用 AAC 音訊。VS Code 將能夠播放 .mp4 的視訊部分，但由於不支援 AAC 音訊，因此不會有聲音。您需要使用 MP3 作為音訊軌。

停用增量命名

您現在可以使用 explorer.incrementalNaming 設定的新 disabled 值，在檔案總管中停用增量檔案命名。此值會停用在檔案總管中貼上時變更檔案名稱的邏輯。如果檔案名稱已存在，系統會提示您覆寫現有檔案，這與大多數原生檔案總管類似。

在 VS Code 應用程式資料夾內編輯時發出警告

在 VS Code 應用程式資料夾內編輯檔案時，編輯器中現在會顯示警告。意外修改應用程式資料夾中的檔案是很常見的錯誤，而且通常不是人們的本意。

VS Code warns when editing its application folder files

編輯器

改善的自動捲動行為

選取和拖曳時，編輯器過去的捲動方式取決於顯示器的每秒影格數 (FPS)，有時會在滑鼠到達編輯器邊緣時立即快速捲動編輯器。現在，當滑鼠靠近邊緣時，編輯器會以更易於管理的速度自動捲動，大約每秒一個檢視區，當滑鼠離編輯器更遠時，捲動速度會更快，這與 FPS 無關。

在以下影片中，當滑鼠游標向下移離編輯器時，捲動速率會增加。

改善的浮動提示

編輯器浮動提示過去在隱藏自身方面非常激進，尤其是在滑鼠移到編輯器的空白區域上方時。這使得難以觸及浮動提示中顯示的某些動作。現在，只要滑鼠朝著浮動提示移動，浮動提示就會保持可見。設定 "editor.hover.sticky": false 會還原為先前的行為。

在右側的「之後」影片中，從浮動提示中選取快速修正更容易

新的程式碼動作群組

程式碼動作控制項中有兩個新的群組可用，分別是 Inline 和 Move。

這些群組對應於 refactor.inline 和 refactor.move 程式碼動作種類。

新的程式碼動作色彩

您可能會注意到，此反覆運算的程式碼動作控制項看起來也略有不同。樣式已更新為使用更適當的主題色彩。最大的變更是控制項主體現在使用 editorWidget.* 色彩，而不是 menu.*。

我們仍在精簡這些色彩，因此如果它們無法與給定的主題良好搭配，或遺失任何色彩自訂選項，請告訴我們。

擴充功能

最近更新的擴充功能

VS Code 現在會在擴充功能檢視中 更新 的 最近更新 區段中顯示過去 7 天內更新的擴充功能。

Recently Updated section in the Extensions view

需要注意的擴充功能

VS Code 現在會將需要注意的擴充功能排序到 擴充功能 檢視預設 已安裝 區段的頂端。這包括具有擱置更新或已更新或停用且需要 VS Code 重新載入的擴充功能。

Extensions requiring attention are displayed at the top of the Extensions view

活動列中擴充功能圖示上的徽章現在會顯示需要注意的擴充功能數量。

Extensions badge showing that four extensions require attention

忽略擴充功能的更新

您現在可以按一下 更新 下拉式選單中的 忽略更新 按鈕，以忽略擴充功能的更新。這會將擴充功能從需要注意的擴充功能清單中移除。

Ignore Updates option in Extensions view context menu

您可以取消選取相同的 忽略更新 按鈕來復原此動作。

Checked Ignore Updates option in Extensions view context menu

請注意，安裝特定版本的擴充功能 (透過 安裝另一個版本) 也會忽略該擴充功能的更新。

已安裝擴充功能的排序

您現在可以依 安裝計數、評等、名稱、發佈日期 和 更新日期 排序已安裝擴充功能清單。

Extensions view Sort By menu options

搜尋

結果顯示為樹狀檢視

您現在可以在樹狀結構中檢視搜尋結果！只需按一下搜尋檢視頂角中的清單/樹狀結構圖示，即可在清單和樹狀檢視之間切換。

Search results shown as a tree view

主題：Night Owl Light (在 vscode.dev 上預覽)

檔案裝飾設定

在搜尋結果中，現在可以開啟和關閉反映檔案狀態的檔案名稱徽章和色彩。設定為 搜尋 > 裝飾：徽章 (search.decorations.badges) 和 搜尋 > 裝飾：色彩 (search.decorations.colors)。

Search results file decoration settings

主題：Night Owl Light (在 vscode.dev 上預覽)

原始檔控制

探索巢狀 Git 存放庫

為了回應長期存在的功能要求，此里程碑我們對存放庫探索進行了變更，以新增對巢狀 Git 存放庫的支援。根據巢狀存放庫的位置，您可能需要修改 git.repositoryScanMaxDepth 設定 (預設為 1 層)。

新增對具有密碼的金鑰的 SSH 金鑰支援

當具有密碼的金鑰的 SSH 金鑰用於 Git 作業時，VS Code 現在會顯示快速輸入控制項，以便您可以輸入 SSH 金鑰的密碼。密碼不會快取，而且每次執行 Git 作業時都必須輸入。

提取後再簽出

此里程碑我們新增了一個新設定 git.pullBeforeCheckout，以簡化切換分支的程序。啟用此設定後，如果沒有外寄認可，我們將從遠端存放庫提取並快速轉送分支，然後再簽出。

存放庫提取改進

對於具有多個遠端存放庫的 Git 存放庫，叫用提取命令現在會顯示包含所有遠端存放庫清單的快速選取。使用者可以選取要提取的特定遠端存放庫，或從所有遠端存放庫提取。

中止合併命令

有一個新命令 Git：中止合併，用於中止目前正在進行的合併作業。

終端機

終端機快速修正

我們開始推出一項由 Shell 整合提供支援的新功能，稱為快速修正。此功能隨附音訊提示支援。使用 audioCues.terminalQuickFix 啟用它，以獲得快速修正可用的聲音指示。

當命令對應到使用者可能採取的一組動作時，快速修正是可用的，並且可以透過編輯器中使用的相同快速鍵 Ctrl+. 或 Cmd+. 啟動。

以下是初始支援的快速修正

Git 類似命令

當 Git 命令輸入錯誤時，快速修正會建議類似的命令。

Run: git status is suggested after git sttatus is mistyped

Git 設定上游

當執行 git push 且沒有上游遠端存放庫時，快速修正會建議使用上游遠端存放庫引數推送。

Run: git push set upstream is suggested

Git 建立 PR

當分支第一次推送至遠端存放庫時，快速修正會建議開啟連結以建立 PR。

An open GitHub PR link action is offered

可用連接埠

當伺服器使用已在使用的連接埠啟動時，快速修正會提供一個動作來終止程序並釋放連接埠。

A server launch fails with a port 3000 in use error. An action to free port 3000 is offered.

Shell 整合改進

對 Shell 整合進行了以下改進

  • 執行最近的命令 和 前往最近的目錄 現在將清除該行 (如果它有內容) (或如果無法可靠地判斷)。
  • 移除了 Bash 指令碼對 $PREFIX 環境變數的使用，這可能會與某些組建工具衝突。
  • 潤飾了 Zsh 指令碼以修正 $ZDOTDIR 附近的一些邊緣案例。
  • 更好地處理在多個使用者之間共用的機器上的 Zsh Shell 整合。

超連結支援

現在支援從終端機中執行的應用程式傳送的超連結。這些允許呈現指向 URL 的標籤，並以虛線底線顯示

Hyperlinks appear in the terminal with dashed underlines, hovering the hyperlink reveals the URL

以下是如何撰寫具有標籤「VS Code」且指向 https://vscode.dev.org.tw 的連結的範例

printf '\e]8;;https://vscode.dev.org.tw\e\\VS Code\e]8;;\e\\'

或更一般而言

\x1b]8;; <URL> \x1b\ <Label> \x1b]8;;\x1b\'

VT 功能支援

此版本帶來了對這些 VT 逸出序列的支援

  • DECRQM：ANSI 和 DEC 私人模式報告 (CSI Ps $ p) - 此序列允許程式查詢終端機中各種模式，例如換行或括號貼上模式。
  • DECSCA：保護屬性 (CSI Ps " q) - 此屬性決定 DECSED 和 DECSEL 是否可以清除內容。

音訊鈴聲

音訊鈴聲現在可在終端機中運作，並且可以透過 terminal.integrated.enableBell 啟用。

終端機文件

終端機文件已重構，並移至 VS Code 網站上的自有目錄。

現在有特定於下列項目的主題

  • 終端機基礎知識 - 快速掌握 VS Code 整合式終端機。
  • 終端機設定檔 - 瞭解如何透過設定檔自訂終端機。
  • Shell 整合 - VS Code 可以提供命令狀態、歷程記錄和快速導覽等功能。
  • 外觀 - 修改終端機文字和游標樣式及色彩。
  • 進階 - 自訂快速鍵和 Unicode 和表情符號字元的進階支援。

希望您能夠在需要時輕鬆找到正確的文件。

工作

釘選執行工作項目

工作可以釘選在 工作：執行工作 清單中，以便更快更輕鬆地存取。

Pinned items are the top category in the Run Task list

工作完成音效

工作完成時會播放音效，以啟用多工處理並改善協助工具。透過 audioCues.taskCompleted 設定設定音訊提示。

語言

Markdown 連結驗證

使用 Markdown 時，很容易錯誤地新增無效的檔案連結或影像參考。也許您忘記檔案名稱使用 - (破折號) 而不是 _ (底線)，或者您連結的檔案已移至不同的目錄。通常您只會在檢視 Markdown 預覽或發佈後才發現這些錯誤。VS Code 新的 Markdown 連結驗證可以協助您發現這些錯誤。

若要開始使用，請設定 "markdown.validate.enabled": true。VS Code 現在將分析 Markdown 連結到標頭、影像和其他本機檔案的連結。無效的連結將回報為警告或錯誤。

A warning shown in the editor when linking to a file that does not exist

VS Code 甚至可以發現其他 Markdown 檔案中特定標頭的無效連結！

您可以使用一些設定來自訂連結驗證

  • markdown.validate.fileLinks.enabled - 啟用/停用本機檔案連結的驗證：[link](/path/to/file.md)
  • markdown.validate.fragmentLinks.enabled - 啟用/停用目前檔案中標頭連結的驗證：[link](#_some-header)
  • markdown.validate.fileLinks.markdownFragmentLinks - 啟用/停用其他 Markdown 檔案中標頭連結的驗證：[link](other-file.md#some-header)
  • markdown.validate.referenceLinks.enabled - 啟用/停用參考連結的驗證：[link][ref]。
  • markdown.validate.ignoredLinks - 跳過驗證的連結 Glob 清單。如果您連結到磁碟上不存在但在 Markdown 發佈後確實存在的檔案，這會很有用。

試試看，並告訴我們您對新功能的看法！

為 Markdown 擷取至連結定義

參考連結讓您可以輕鬆地在 Markdown 來源中多次使用相同的連結

This [link][example-link] and [this link][example-link] both point to the same place!

[example-link]: http://example.com

這很方便，因為您只需變更檔案中的一個位置即可更新兩個連結。

新的 擷取至連結定義 重構可協助您將現有的 Markdown 連結轉換為連結定義和參考連結。此重構將轉換目前文件中連結的所有出現次數。例如，對於 Markdown 文件

[Markdown](https://daringfireball.net/projects/markdown/) and you: Adventures in [Markdown linking](https://daringfireball.net/projects/markdown/)!

在任一 https://daringfireball.net/projects/markdown/ 連結上執行 擷取至連結定義 將導致

[Markdown][md] and you: Adventures in [Markdown linking][md]!

[md]: https://daringfireball.net/projects/markdown/

執行重構後，VS Code 會提示您輸入連結定義的名稱。在上述範例中，我們輸入了 md。

在 Markdown 中組織連結定義

Markdown 檔案的新 組織連結定義 程式碼動作 (source.organizeLinkDefinitions) 會將所有連結定義群組到檔案底部，依字母順序排序它們，並移除任何未使用的連結定義。可以使用 來源動作 命令執行此動作。

例如，在 Markdown 來源中

Some [link][example] and an image:

![An image of a cat][cat-gif]

[example]: http://example.com
[cat-gif]: /keyboard-cat.gif
[some unused link]: http://example.com/file2

執行 組織連結定義 將會

Some [link][example] and an image:

![An image of a cat][cat-gif]

[cat-gif]: /keyboard-cat.gif
[example]: http://example.com

請注意，未使用的 some unused link 定義已移除，而剩餘的定義已依字母順序排序。

CSS / LESS / SCSS

CSS 語言支援現在瞭解 @property 和 @layer at-rules。

筆記本

筆記本 JavaScript 輸出現在評估為模組

筆記本中的 JavaScript 輸出現在視為模組。這表示在輸出內宣告的變數將不再洩漏到其他輸出 (如果是 const 變數，則可能甚至會阻止執行具有衝突變數名稱的其他輸出)。

這也表示您現在可以在 JavaScript 輸出內使用 import

%%javascript
import { myFunction } from './myModules.js';

console.log(myFunction());

筆記本大綱中支援 HTML 標頭

現在可以在筆記本 大綱 檢視中偵測和呈現 Markdown 儲存格中的 HTML 標頭。

HTML headers in notebook Markdown cells

適用於 Web 的 VS Code

瀏覽器網址列中的 'code'

現在有一個 Chrome/Edge 瀏覽器擴充功能，可讓您更輕鬆地在 vscode.dev 中開啟您的 GitHub 存放庫。

若要開始使用

  1. 從 Chrome 線上應用商店安裝擴充功能。
  2. 在瀏覽器搜尋列中輸入 code 以啟動網址列。
  3. 依名稱搜尋 GitHub 存放庫，然後按下 Enter。建議由您的瀏覽器搜尋歷程記錄填入，因此如果您想要的存放庫沒有出現，您也可以輸入完整合格的 <擁有者>/<存放庫> 名稱來開啟它，例如 microsoft/vscode。

在以下影片中，使用者透過輸入 code vscode 在 vscode.dev 中開啟 microsoft/vscode 存放庫。

此擴充功能受到 Goto GitHub Repo Chrome 擴充功能的啟發，並對其表示衷心感謝，該擴充功能由前 VS Code 團隊成員 Pine Wu 建立。

在切換開發環境時隨身攜帶您的變更

當您瀏覽 GitHub 或 Azure Repos 存放庫 (例如 https://vscode.dev/github/microsoft/vscode) 時，您可以使用 繼續在...上工作 命令來選取要與存放庫搭配使用的不同開發環境。

先前，如果您在虛擬工作區中有未認可的變更，則需要將它們推送至 GitHub 或 Azure Repos，才能在其他地方檢視它們。在此里程碑中，我們已將 編輯工作階段 整合新增至 繼續在...上工作 功能，以便您的未認可變更自動隨您移動到您的目標開發環境，例如 GitHub Codespace

在以下影片中，當使用者建立並切換到在新的 GitHub Codespace 中工作時，他們在使用適用於 Web 的 VS Code 時對 JavaScript 檔案所做的變更會套用。

在此版本中，當您第一次將 繼續在...上工作 與未認可的變更搭配使用時，您將可以選擇使用 編輯工作階段 將您的編輯帶到您選取的開發環境，這會使用 VS Code 服務來儲存您擱置中的變更。這些變更會在套用至您的目標開發環境後從我們的服務中刪除。如果您選擇繼續而不使用您的未認可變更，您可以隨時透過設定 "workbench.editSessions.continueOn": "prompt" 設定來變更此喜好設定。

Prompt to bring working changes with you when using Continue Working On

當您使用適用於 Web 的 VS Code 時，當您在下列項目中使用 繼續在...上工作 時，您的未認可變更將隨您移動

  • GitHub Codespaces 中的新雲端託管環境
  • GitHub 存放庫的新本機複本
  • 具有相同虛擬 GitHub 存放庫的本機 VS Code 執行個體

當您將桌面 VS Code 與 遠端存放庫 擴充功能搭配使用時，當您在下列項目中使用 繼續在...上工作 時，您的未認可變更將隨您移動

  • GitHub Codespaces 中的雲端託管環境 (透過 GitHub Codespaces 擴充功能提供)
  • GitHub 存放庫的新本機複本
  • 容器磁碟區中 GitHub 存放庫的新複本 (透過 開發容器 擴充功能提供)
  • https://vscode.dev
  • 包含存放庫複本的現有本機資料夾

問題回報

問題的臨界值增加到 7500 個字元

當使用內建問題報告程式來報告 VS Code 或擴充功能的問題時，用於在 github.com 上開啟問題的 URL 中的字元數有限制。如果您達到此限制，您將在問題內文中看到一則訊息，指出 我們已將需要的資料寫入您的剪貼簿，因為它太大而無法傳送。請貼上。。遺憾的是，有些使用者沒有注意到此訊息，並忘記將資料貼到問題內文中。

在此里程碑中，我們已將臨界值增加到 7500 個字元。這是因為

  1. 某些對 URL 中的字元數有硬性限制的瀏覽器已不再支援 (EOL)。
  2. GitHub 對 URL 中的字元數有自己的限制。

這幾乎將 URL 中包含的字元數增加三倍，這應足以滿足大多數使用者，並且剪貼簿訊息將較少顯示。

與執行中的擴充功能編輯器搭配使用問題報告程式

如果您使用命令 開發人員：顯示執行中的擴充功能 開啟 執行中的擴充功能 編輯器，並選取 報告問題 按鈕，它將顯示內建問題報告程式。之前，這會將您帶到 GitHub 問題並要求您貼上，並且在擴充功能存放庫中建立許多不必要且品質低劣的問題。擴充功能的 報告問題 按鈕現在會通過內建問題報告程式，並讓使用者提交高品質的擴充功能問題。

擴充功能貢獻

遠端開發

遠端開發擴充功能可讓您使用開發容器、遠端電腦或 Windows Subsystem for Linux (WSL) 作為全功能開發環境。

我們已聽到您關於 Remote - WSL 和 Remote - Containers 擴充功能命名的意見反應。我們在它們的名稱中使用 Remote 是為了表示您在「遠端」或「個別」WSL 發行版本或開發容器中開發，而不是傳統的本機開發。但是，這與許多人使用的「遠端」用法不同，並且可能會導致混淆 (例如，開發容器是否在我的機器上？)。

因此，我們已更新這些擴充功能的命名和產品內命令，使其更清晰，將它們重新命名為 WSL 和 開發容器。Marketplace 和文件中的擴充功能識別碼等連結保持不變，因此您不應看到目前使用這兩個擴充功能時發生中斷。

WSL extension in the Marketplace

Dev Containers extension in the Marketplace

除了重新命名之外，這些擴充功能的功能和修正工作也持續進行。您可以在遠端開發發行說明中瞭解更多資訊。

開發容器功能

開發容器功能可讓您輕鬆地將預先封裝的功能新增至您的開發容器。無論是 Git 或 Docker 等工具，還是對 Go 或 Java 等程式設計語言的支援，您都可以檢閱可用功能清單，並將它們新增至您的 devcontainer.json。您也可以使用功能範本建立您自己的功能以發佈並與他人共用。

GitHub Pull Requests 和 Issues

在 GitHub Pull Requests 和 Issues 擴充功能上取得了更多進展，這可讓您處理、建立和管理提取要求和問題。此版本的重點包括

  • 改善對 GitHub Enterprise Server 的支援。這包括
    • VS Code 內建 GitHub Enterprise Server 驗證提供者的 PAT-less 驗證。
    • 當您開啟具有 Enterprise 存放庫的資料夾時自動偵測，以及設定的入門指南。
    • GitHub Enterprise Server 錯誤的修正。
  • 用於將檔案標示為已檢視的核取方塊。

查看擴充功能 0.52.0 版本的變更記錄，以查看其他重點。

GitHub Issue Notebooks

工作區編輯

GitHub Issue Notebooks 擴充功能展示了筆記本 API，並且也被證明非常方便。本著這種精神，我們採用了工作區編輯 API 的最新改進。有新的程式碼動作

  • 將儲存格移動/複製到新的筆記本。
  • 允許您使用 OR 陳述式分割儲存格。
  • 使用程式碼片段編輯將限定值 (例如 label:bug) 擷取到變數中。
  • 針對值設定錯誤的程式碼片段式快速修正。

Move cell into new notebook and Quick Fix for value set violation

在地化

此擴充功能現在已完全在地化為 VS Code 支援的 13 種語言。它也是第一個使用新的 在地化 API 進行在地化的擴充功能，這表示在地化在桌面和 Web 上都適用。

Jupyter

儲存格標籤和投影片放映編輯支援

我們現在可以直接在筆記本編輯器中編輯儲存格標籤和投影片放映類型，而無需開啟文件的 JSON 格式。

這讓我們可以為 papermill 參數化筆記本，或為 nbconvert 自訂筆記本。

Edit Jupyter notebook cell tags

我們現在也可以透過命令直接更新筆記本儲存格的投影片放映類型，以將筆記本變成簡報投影片。

Edit Jupyter notebook slideshow

以上兩個範例都使用 筆記本工作區編輯 API 來編輯儲存格中繼資料。如果您有興趣瞭解如何支援編輯其他自訂儲存格中繼資料，您可以從 GitHub 存放庫 (cell-tags、slideshow) 瞭解更多資訊。

改善互動式視窗的命令互動

interactive.input.focus 命令現在將焦點放在最近使用的互動式視窗的輸入方塊上。在以下簡短影片中，命令與自訂鍵盤快速鍵搭配使用。

Interactive Window navigation using keyboard shortcuts

Notebook Delete cell commands are enabled for Interactive Window cells, and can now be undone。

Python 檔案儲存格摺疊

Python 檔案中以 # %% 標記的「儲存格」現在可以在編輯器中摺疊。

GitHub Enterprise Server 驗證支援

在此之前，GitHub Enterprise Server 使用者必須手動建立個人存取權杖 (PAT)，才能登入 VS Code 中的 GitHub Enterprise Server (例如，與 GitHub Pull Requests and Issues 擴充功能搭配使用)。這個過程繁瑣，使用者必須離開 VS Code 才能建立 PAT、確保已使用正確的權限建立 PAT、複製 PAT，然後貼回 VS Code。

現在不用了。現在，GitHub Enterprise Server 登入流程與 github.com 登入流程相同，使用者無需建立 PAT 即可登入 GitHub Enterprise Server。若要親身體驗此新功能，您可以從 Marketplace 取得 GitHub Pull Requests and Issues 擴充功能，將 github-enterprise.uri 設定設為您的 GitHub Enterprise Server URI，然後試用看看。以下影片示範了全新體驗

佈景主題：Panda Theme (在 vscode.dev 上預覽)

Python

建立環境命令

新增了 建立環境 命令，可為 VS Code 中的 Python 使用者自動建立虛擬環境或 conda 環境。使用者可以透過命令面板觸發此命令，選擇要使用 venv 建立新的虛擬環境還是 Conda 環境，最後為專案選取所需的直譯器。此命令也會安裝專案資料夾中 requirements.txt 檔案中列出的必要套件。我們希望這項新功能能簡化環境建立流程，並鼓勵使用者為了最佳程式碼撰寫實務而使用環境。

Create new virtual environment with Create Environment command

擴充功能作者的新環境 API

Python API 現在提供擴充功能一種方式，可與 Python 擴充功能在使用者電腦中找到的 Python 環境搭配運作。擴充功能也可以使用它來存取 Python 擴充功能用來執行指令碼的選取環境路徑，或將其更新為偏好的路徑。

歡迎在 issue #18888 中提供您的意見反應。請注意，API 尚未最終定案，因此仍可能在未提供回溯相容性的情況下根據意見反應進行變更。

Python 擴充功能範本

Python 擴充功能範本 可協助您為您喜愛的 Python 工具 (例如，linter、格式器或程式碼分析公用程式) 建置 Visual Studio Code 擴充功能。範本 提供您建置擴充功能所需的基本建構區塊，以將您的工具整合到 VS Code 中。

預覽功能

設定檔

我們在過去幾個月致力於在 VS Code 中支援 設定檔，這是社群最熱門的需求之一。此功能可透過 workbench.experimental.settingsProfiles.enabled 設定以預覽版形式提供。試用看看，並在 vscode 存放庫 中建立 issue 或在 issue #116740 中留言，向我們提供您的意見反應。

設定檔指示器

VS Code 在活動列底部顯示設定檔指示器。預設情況下，指示器中會顯示設定檔名稱的前兩個字元。您也可以將簡短名稱自訂為任何兩個字元、表情符號或 codicon。可以使用 $(codicon-id) 語法來參考 codicon。

Settings Profiles indicator

當您按一下此指示器時，會顯示一個包含 變更簡短名稱 選項的選單。

Settings Profiles menu

同步設定檔

VS Code 現在支援跨 VS Code 執行個體同步設定檔。

注意： 此功能目前僅在 VS Code 的 Insiders 版本中提供。

WebAssembly 和 Web 中的 Python 執行

在過去幾個月中，我們致力於將 WebAssembly (WASM) 引入 VS Code。為了啟用支援，我們進行了兩件事

以下螢幕擷取畫面顯示執行 Hello World 程式

Execute Python file in VS Code for the Web

您也可以使用 Python WASM: Start REPL 命令啟動 Python REPL。

Python REPL running in VS Code for the Web

請注意，程式庫和擴充功能都仍在開發中，並以預覽版形式提供。WebAssembly Python 直譯器和 VS Code 本身都存在限制。直譯器的主要限制如下

  • 不支援 pip。
  • 不支援 socket。
  • 不支援執行緒。因此，不支援非同步。

但是，支援建立您自己的 Python 環境，包括來源 wheel Python 套件。請查看擴充功能的 README 以取得詳細資訊。

VS Code 中的限制如下

  • 不支援偵錯。您只能執行 Python 檔案。
  • 不支援原生 Python 模組。

但請隨時關注。我們正在規劃解除其中一些限制。

擴充功能撰寫

在乾淨環境中偵錯擴充功能

偵錯擴充功能時，一直存在一個問題，即擴充功能是在擴充功能作者的開發環境 (使用者設定和已安裝的擴充功能) 中執行，而不是在更適合擴充功能目標使用者的環境中執行。

透過最近推出的「設定檔」功能，現在可以在不同的環境中執行開發中的擴充功能，方法是在擴充功能的偵錯組態中指定設定檔。啟用 workbench.experimental.settingsProfiles.enabled 設定以啟用設定檔功能。

支援兩種情境

  • 在乾淨環境中偵錯，方法是使用未命名的「空白」設定檔，該設定檔會在擴充功能偵錯停止時自動刪除。
  • 在受控制的環境中偵錯，方法是使用專門為開發中的擴充功能建立的具名設定檔，其中包含特定的使用者設定和擴充功能。

此偵錯組態顯示如何使用 --profile-temp 參數在乾淨環境中偵錯

{
  "name": "Extension",
  "type": "extensionHost",
  "request": "launch",
  "args": ["--profile-temp", "--extensionDevelopmentPath=${workspaceFolder}"],
  "outFiles": ["${workspaceFolder}/dist/**/*.js"],
  "preLaunchTask": "npm: watch"
}

以下是在受控制的環境中偵錯的偵錯組態，該環境使用先前建立名為「extensionContext」的設定檔

{
  "name": "Extension",
  "type": "extensionHost",
  "request": "launch",
  "args": ["--profile=extensionContext", "--extensionDevelopmentPath=${workspaceFolder}"],
  "outFiles": ["${workspaceFolder}/dist/**/*.js"],
  "preLaunchTask": "npm: watch"
}

請注意，當在遠端位置偵錯擴充功能時 (透過 Remote Development 擴充功能 Dev Containers、SSH 或 WSL)，使用 --profile-temp 旗標會導致此狀態訊息

Disconnected Status bar message

這是預期的行為，因為暫時設定檔不包含任何擴充功能，這表示 Remote Development 擴充功能也遺失了。對於遠端情境，建議您建立空白的具名設定檔，將 Remote Development 擴充功能新增至其中，然後使用 --profile=.... 命令列選項。

改良的工作區編輯 API

使用 WorkspaceEdit 編輯 Notebook

Workspace 編輯現在可以使用 vscode.NotebookEdit 修改 Notebook。vscode.NotebookEdit 類別包含靜態工廠函式，用於建立在 Notebook 中插入、取代和刪除儲存格的編輯

const currentNotebook = vscode.window.activeNotebookEditor?.notebook;
if (currentNotebook) {
  const edit = new vscode.WorkspaceEdit();

  // Use .set to add one or more edits to the notebook
  edit.set(currentNotebook.uri, [
    // Create an edit that inserts one or more cells after the first cell in the notebook
    vscode.NotebookEdit.insertCells(/* index */ 1, [
      // ... new notebook cell data
    ])

    // Additional notebook edits...
  ]);

  await vscode.workspace.applyEdit(edit);
}

使用 WorkspaceEdit 執行程式碼片段編輯

新的 SnippetTextEdit 類型允許擴充功能使用 WorkspaceEdit 執行程式碼片段編輯。程式碼片段編輯類似於一般文字編輯，但它們允許使用者在預留位置之間跳轉、插入變數、從選擇元素中選取等等。如需程式碼片段的詳細資訊，請參閱本指南

請注意，程式碼片段編輯需要程式碼或 Notebook 編輯器，並且只能支援單一編輯器的程式碼片段編輯，否則它們的行為會像一般文字編輯一樣。

我們相信，結合程式碼片段編輯和工作區編輯可以實現新的、更順暢的程式碼動作和重構，例如以下來自 GitHub Issue Notebooks 擴充功能的範例。

使用 WorkspaceEdit 建立包含內容的檔案

您現在可以在使用 WorkspaceEdit 建立檔案時指定內容。若要執行此操作，請傳遞包含其選項包的內容

const edit = new vscode.WorkspaceEdit();
edit.createFile(newFileUri, { contents: new Unit8Array([1, 2, 3]) });

await vscode.workspace.applyEdit(edit);

貢獻的 Webview 內容選單

新的 Webview 內容選單 API 讓進階 Webview 可以輕鬆自訂使用者在 Webview 內按一下滑鼠右鍵時顯示的內容選單。這個新的貢獻點使用 VS Code 的一般內容選單，因此自訂選單可以與編輯器的其餘部分完美整合。Webview 也可以為 Webview 的不同區段顯示自訂內容選單。

若要將新的內容選單項目新增至您的 Webview，請先在新的 webview/context 區段下的 menus 中新增一個項目。每個貢獻都採用 command (這也是項目的標題來源) 和 when 子句。when 子句 應包含 webviewId == 'YOUR_WEBVIEW_VIEW_TYPE'，以確保內容選單僅適用於您擴充功能的 Webview

"contributes": {
  "menus": {
    "webview/context": [
      {
        "command": "catCoding.yarn",
        "when": "webviewId == 'catCoding'"
      },
      {
        "command": "catCoding.insertLion",
        "when": "webviewId == 'catCoding' && webviewSection == 'editor'"
      }
    ]
  },
  "commands": [
    {
      "command": "catCoding.yarn",
      "title": "Yarn 🧶",
      "category": "Cat Coding"
    },
    {
      "command": "catCoding.insertLion",
      "title": "Insert 🦁",
      "category": "Cat Coding"
    },
    ...
  ]
}

在 Webview 內部，您也可以使用 data-vscode-context data 屬性 (或在 JavaScript 中使用 dataset.vscodeContext) 設定 HTML 特定區域的內容。data-vscode-context 值是一個 JSON 物件，指定使用者在元素上按一下滑鼠右鍵時要設定的內容。最終內容是由從文件根目錄到按一下的元素來決定的。

以這個 HTML 為例

<div class="main" data-vscode-context='{"webviewSection": "main", "mouseCount": 4}'>
  <h1>Cat Coding</h1>

  <textarea data-vscode-context='{"webviewSection": "editor", "preventDefaultContextMenuItems": true}'></textarea>
</div>

如果使用者在 textarea 上按一下滑鼠右鍵，則會設定下列內容

  • webviewSection == 'editor' - 這會覆寫父元素中的 webviewSection。
  • mouseCount == 4 - 這是從父元素繼承的。
  • preventDefaultContextMenuItems == true - 這是一個特殊內容，會隱藏 VS Code 通常新增至 Webview 內容選單的複製和貼上項目。

如果使用者在 <textarea> 內按一下滑鼠右鍵，他們將會看到

Custom context menus showing in a webview

Webview 中作用中佈景主題的新佈景主題變數

Webview 中的新 data-vscode-theme-id 資料屬性會儲存目前作用中佈景主題的 ID。這會取代現在已淘汰的 data-vscode-theme-name 屬性，該屬性會追蹤佈景主題的完整名稱 (並且也可能已當地語系化)

body[data-vscode-theme-id="One Dark Pro"] {
    background: hotpink;
}

如果您在 Webview 中使用 data-vscode-theme-name，請移轉至新的 data-vscode-theme-id 屬性。

非同步 Notebook 轉譯器

Notebook 轉譯器 API 現在可以更好地支援非同步 Notebook 轉譯器。雖然先前已隱含地支援此功能，但現在 renderOutputItem 可以傳回 Promise，以指示輸出項目正在轉譯中。renderOutputItem 函式現在也會傳遞 AbortSignal，如果轉譯已取消，則會中止該訊號。

renderOutputItem(outputItem: OutputItem, element: HTMLElement, signal: AbortSignal): void | Promise<void>;

如果您的轉譯器執行任何非同步工作，請採用這些 API 更新，以便 VS Code 能夠更好地支援您的轉譯器。

Refactor.move 程式碼動作種類

新的 refactor.move 程式碼動作種類可用於移動程式碼的重構 (例如，將符號移動到新檔案或重新排序檔案中的程式碼)。

雖然擴充功能先前可以建立 refactor.move 種類的程式碼動作，但此種類現在已正式記錄在文件中，並且受到新的程式碼動作控制項支援。

選取的樹狀結構項目傳遞至檢視/標題動作

貢獻給 view/title 選單的命令將會收到兩個引數：第一個是焦點樹狀結構節點，第二個是樹狀結構中所有選取的項目。

樹狀結構檢視 initialSize 貢獻已最終定案

在 package.json 中貢獻檢視的擴充功能可以使用 initialSize 屬性來設定其檢視的初始大小。initialSize 的運作方式與 CSS flex-grow 類似。

initialSize 何時套用有一些限制

  • 它只是初始大小。一旦檢視已轉譯，initialSize 將不會再次套用。
  • 它僅在擴充功能同時擁有檢視和檢視容器時套用。

樹狀結構檢視 Badge 已最終定案

TreeView 具有選用的 viewBadge 屬性，可用於在檢視的檢視容器上設定數字徽章。

View badge on a view in the Activity bar

未繫結中斷點警告圖示

偵錯擴充功能現在可以在有作用中的偵錯工作階段且具有未繫結中斷點時定義提示訊息。它會顯示在 [中斷點] 檢視的標頭中，以及在將滑鼠指標停留在編輯器中的灰色中斷點圖示上方時顯示。以下是在 js-debug 擴充功能中如何使用它的範例

Hovering the breakpoint warning icon

此訊息可以在偵錯工具貢獻的新 strings 屬性中宣告，如下所示

"strings": {
  "unverifiedBreakpoints": "Message text goes here"
}

VS Code 社群討論

現在有一個 VS Code 社群討論 網站，供擴充功能作者作為一個聚集地，提出問題、與其他開發人員聯繫，並展示出色的工作成果。您可以在那裡找到與 VS Code API 相關的公告、發布問題或搜尋現有答案，以及查看 擴充功能展示。

建議的 API

每個里程碑都附帶新的建議 API，擴充功能作者可以試用它們。與往常一樣，我們希望收到您的意見反應。以下是試用建議 API 的步驟

  1. 尋找您想要試用的提案，並將其名稱新增至 package.json#enabledApiProposals。
  2. 使用最新的 vscode-dts 並執行 vscode-dts dev。它會將對應的 d.ts 檔案下載到您的工作區。
  3. 您現在可以針對提案進行程式設計。

您無法發佈使用建議 API 的擴充功能。下一個版本中可能會出現重大變更，我們絕不希望破壞現有的擴充功能。

可擴充的 JavaScript Notebook 轉譯器

我們的內建 Notebook 轉譯器 現在公開實驗性 API，讓擴充功能可以自訂 JavaScript 內容的轉譯。此 API 目前公開單一 Hook preEvaluate，該 Hook 在評估 JavaScript 內容之前叫用。

若要嘗試使用此實驗性 API，您的擴充功能需要擴充 vscode.builtin-renderer API。

"contributes": {
  "notebookRenderer": [
    {
      "id": "vscode-samples.my-custom-js-extension",
      "displayName": "My custom javascript renderer extension",
      "entrypoint": {
        "extends": "vscode.builtin-renderer",
        "path": "./out/main.js"
      }
    }
  ]
}

然後，您的轉譯器可以在 vscode-builtin-renderer 上註冊轉譯 Hook

import type { RendererContext } from 'vscode-notebook-renderer';

export async function activate(ctx: RendererContext<void>) {
  const builtinRenderer = await ctx.getRenderer('vscode.builtin-renderer');
  if (!builtinRenderer) {
      throw new Error(`Could not load 'vscode.builtin-renderer'`);
  }

  builtinRenderer.experimental_registerJavaScriptRenderingHook({
    // Invoked before th js has been evaluated
    preEvaluate(outputItem: OutputItem, element: HTMLElement, script: string, signal, signal: AbortSignal): string | undefined | Promise<string | undefined> {
      // You can either modify `element` or return a new script source here
    }
  });
}

試用這個新 API，並告訴我們您的想法！

env.shell 變更的事件

已新增新的事件 env.onDidChangeShell 以補充 env.shell，這是偵測到的擴充功能主機的預設 Shell

env.onDidChangeShell(newShell => {
  console.log(newShell); // Same value as env.shell
});

樹狀結構項目核取方塊

建議的 checkboxState 可讓您將核取方塊新增至樹狀結構項目。

Tree items with checkboxes

this.checkboxState = {
  state: vscode.TreeItemCheckboxState.Unchecked,
  tooltip: 'mark file as viewed'
};

作為 API 一部分的當地語系化

在此反覆運算中，我們正在引入新的 API，以協助擴充功能當地語系化字串。這取代了先前用於當地語系化的 vscode-nls 和 vscode-nls-dev 模組。這些模組將繼續運作，但不會收到任何更多功能。新的 API 和工具旨在讓人感到熟悉，但也更易於使用且更具彈性。此外，將其作為 VS Code API 的一部分包含在內，使我們能夠為您的擴充功能提供 VS Code 桌面版和 VS Code Web 版的當地語系化支援。

VS Code 擴充功能的當地語系化包含四個重要部分

新的 vscode.l10n API

declare module 'vscode' {
  export namespace l10n {
    /**
     * A string that can be pulled out of a localization bundle if it exists.
     */
    export function t(message: string, ...args: any[]): string;
    /**
     * A string that can be pulled out of a localization bundle if it exists.
     */
    export function t(options: {
      message: string;
      args?: any[];
      comment: string[];
    }): string;
    /**
     * The bundle of localized strings that have been loaded for the extension.
     */
    export const bundle: { [key: string]: string };
    /**
     * The URI of the localization bundle that has been loaded for the extension.
     */
    export const uri: Uri | undefined;
  }
}

vscode.l10n 建議的 API 是一個新的命名空間，並提供單一函式 t，可用於宣告字串應當地語系化。可以使用字串或具有 message 屬性的物件呼叫此函式。如果存在當地語系化套件，此函式將會傳回當地語系化字串，否則會傳回原始字串。此函式也支援可用於格式化字串的引數，以及可用於為翻譯人員提供內容的註解。

使用新 API 的簡單範例

import { l10n } from 'vscode';

export function activate(context: vscode.ExtensionContext) {
  const message = l10n.t('Hello in {0}!', vscode.env.language);
  vscode.window.showInformationMessage(message);
}

在此範例中，如果目前語言存在當地語系化套件，則字串 Hello in {0}! 將會當地語系化。{0} 將會取代為目前語言 (預設為 en，法文為 fr，巴西葡萄牙文為 pt-br 等)。如果不存在當地語系化套件，則字串將會原樣傳回，並使用引數格式化。您可能想知道這些當地語系化套件從何而來。我將在下一節中說明。

vscode.l10n API 也提供對當地語系化字串套件或字串套件 URI 的存取權。這旨在用於子程序情境，我稍後將會說明。

重要事項：當您使用此 API 時，您也需要明確宣告當地語系化套件的所在位置。這可以透過在您的 package.json 中新增 l10n 屬性來完成

{
  "main": "./out/extension.js",
  "l10n": "./l10n"
}

l10n 屬性應該是當地語系化套件所包含資料夾的相對路徑。

@vscode/l10n-dev 模組

@vscode/l10n-dev 模組是一個新的模組，用於產生當地語系化套件。您可以將其用作命令列工具或程式庫。兩者都用於透過掃描提供的原始程式碼中的 vscode.l10n.t(..) 呼叫來產生當地語系化套件。

以下是使用命令列工具的簡單範例

npx @vscode/l10n-dev ./src --out ./l10n

這會在 ./l10n 資料夾中放置 bundle.l10n.json 檔案。從那裡，您可以為您想要支援的每個地區設定製作 bundle.l10n.LOCALE.json 檔案。例如，假設上述命令產生下列 bundle.l10n.json 檔案

{
  "Hello": "Hello",
  "Hello {0}": "Hello {0}",
  "Hello {0}/This is a comment": {
    "message": "Hello {0}",
    "comment": ["This is a comment"]
  }
}

如果您想要支援法文，您可以在 bundle.l10n.fr.json 檔案中建立它

{
  "Hello": "Bonjour",
  "Hello {0}": "Bonjour {0}",
  "Hello {0}/This is a comment": "Bonjour {0}"
}

注意：您不需要當地語系化套件中的註解，因為註解僅對翻譯原始套件的翻譯人員有用。

@vscode/l10n-dev 模組也可以用於產生 XLF 檔案。VS Code 團隊產生 XLF 檔案，然後我們將其提供給 Microsoft 的翻譯人員。然後，翻譯人員將翻譯後的 XLF 檔案回覆給我們。然後，我們使用 @vscode/l10n-dev 模組從翻譯後的 XLF 檔案產生當地語系化套件。我們計劃撰寫一篇部落格文章，詳細介紹我們的整體當地語系化流程。

@vscode/l10n 模組

由於 vscode.l10n API 僅在擴充功能主機中可用，因此無法在子程序中使用。因此，我們建立了一個新的模組，可以在子程序中使用該模組來載入當地語系化套件。此模組稱為 @vscode/l10n，其使用方式如下

import { l10n } from '@vscode/l10n';

// Load the translations for the current locale
l10n.config({
  uri: process.env.BUNDLE_URI_FROM_EXTENSION
});

// returns the translated string or the original string if no translation is available
l10n.t('Hello World');

其概念是您的擴充功能端程式碼 (負責啟動子程序) 將使用 vscode.l10n.contents 或 vscode.l10n.uri API，將套件或套件的 URI 傳遞至子程序。然後，子程序可以使用 @vscode/l10n 模組載入套件，並使用 t 函式翻譯字串。@vscode/l10n 模組使用的 t 函式也會在 @vscode/l10n-dev 模組中挑選，以便可以使用一個程序擷取和當地語系化字串。

package.nls.json 檔案

關於 package.nls.json 檔案，沒有任何變更。它仍然用於宣告應當地語系化的預設字串，並且應與 package.json 相鄰。您仍然可以擁有 package.nls.LOCALE.json (其中 LOCALE 類似於 de 或 zh-cn)，如果使用者已將 VS Code 設定為該地區設定，則優先挑選該檔案中宣告的字串。一個小範例

您的 package.json

{
  "name": "my-extension",
  "version": "0.0.1",
  "main": "./out/extension.js",
  "l10n": "./l10n",
  //...
  "contributes": {
    "commands": [
      {
        "command": "my-extension.helloWorld",
        // The key is surrounded by % characters
        "title": "%my-extension.helloWorld.title%"
      }
    ]
  }
}

您的 package.nls.json

{
  // That same key from the package.json
  "my-extension.helloWorld.title": "Hello World"
}

您的 package.nls.de.json

{
  // That same key from the package.json
  "my-extension.helloWorld.title": "Hallo Welt"
}

摘要

這裡當然有很多內容需要消化，但希望這能讓您了解我們在 VS Code 擴充功能中進行當地語系化的方向。

如果您對完整範例感興趣，可以查看 l10n-sample。

如果您有任何問題或意見反應，可以在以下位置告知我們

記錄輸出通道

vscode.window.createOutputChannel API 現在有一個新的 log 布林值選項，可用於建立僅用於記錄的輸出通道。

/**
 * Creates a new {@link LogOutputChannel log output channel} with the given name.
 *
 * @param name Human-readable string which will be used to represent the channel in the UI.
 * @param options Options for the log output channel.
 */
export function createOutputChannel(
  name: string,
  options: { readonly log: true }
): LogOutputChannel;

LogOutputChannel 支援下列方法來記錄訊息

trace(message: string, ...args: any[]): void;
debug(message: string, ...args: any[]): void;
info(message: string, ...args: any[]): void;
warn(message: string, ...args: any[]): void;
error(error: string | Error, ...args: any[]): void;

擴充功能建立的記錄輸出通道會顯示為 [輸出] 下拉式檢視中的個別項目。寫入此記錄輸出通道的訊息會以與 VS Code 記錄訊息相同的格式表示。

Log Output channel

工程

朝向「跨來源隔離」

我們已進行變更，以在 VS Code 桌面版和 vscode.dev 中啟用跨來源隔離。這將啟用新的強大功能，例如共用陣列緩衝區。VS Code 本身以及擴充功能和 Webview 都將受益於此。

跨來源隔離目前位於功能旗標之後，啟用它可能會對從網際網路載入資源的擴充功能和 Webview 產生不良影響。您可以在 Why you need "cross-origin isolated" for powerful features 中閱讀更多相關資訊。我們希望盡早聽到您的意見反應。

若要嘗試此功能

  • 使用 --enable-coi 旗標執行 VS Code 桌面版，例如 code --enable-coi`。
  • 執行 vscode.dev 並附加 vscode-coi 查詢。

若要檢查是否已啟用跨來源隔離，請使用開發人員工具的 [應用程式] 索引標籤，或檢查 crossOriginIsolated 全域變數的值。

Cross Origin Isolation enabled for web

改善啟動效能

我們在此里程碑中保留了工程時間，以改善從啟動 VS Code 到在文字編輯器中看到閃爍游標所需的時間。我們一直追蹤我們的效能數字，並注意到在上一個里程碑結束時效能略有下降，我們想要解決這個問題。

這是一項團隊合作，每個人都在整個原始程式碼中貢獻各種變更。以下列出一些重點。

不再進行同步 fs 呼叫

我們通常會避免 Node.js fs API 的同步變體，因為我們知道這些方法會停止指令碼執行，直到檔案系統要求已解決。但是，在少數情況下，我們仍然依賴同步 fs 執行，尤其是在啟動時開啟或還原視窗時。我們能夠將所有這些呼叫變更為其非同步變體，允許其他指令碼在等待檔案系統要求傳回時繼續執行。

更多主要進入點的套件組合

構成 VS Code 應用程式的主要套件組合大小為數 MB，使用 vscode-loader 作為單一檔案套件組合，並使用 esbuild 縮小。但是，在某些情況下，我們沒有投入套件組合，特別是針對

  • Electron 主要程序中始終首先呼叫的 Node.js 進入點。
  • Electron 轉譯器程序中用於開啟視窗的 Bootstrap JavaScript 檔案。

在這兩個區域中進行套件組合，可讓我們將啟動時查閱 JavaScript 檔案的成本降低到 Electron 主要程序的一次呼叫和視窗本身的一次呼叫。

將程式碼推送到稍後階段

最佳效能修正方法是移除程式碼且永遠不執行它，但這顯然不是可擴充的解決方案。另一種方法是將程式碼的執行延遲到稍後階段，例如在文字編輯器開啟之後。在此里程碑中，我們再次檢閱了我們的各種元件，並將其中一些元件推送到稍後階段，以避免封鎖重要的啟動路徑。

文件內部工具

為了分析效能，我們大量使用瀏覽器的開發人員工具和 OS 檢查工具。但是，我們也有一些內建於 VS Code 中的工具。我們在 Perf Tools for VS Code Development 中記錄了自訂工具，以便更多人可以從中受益。

更快的 PR 檢查

對於提取要求，我們會執行自動單元、整合和煙霧測試。所有這些都在平行發生，但每個步驟都需要將我們的 TypeScript 來源轉譯為 JavaScript 程式碼。最初，我們使用 TypeScript 編譯器來執行此操作。它會發出 JavaScript，但也執行類型檢查。後者非常耗時，而且對於測試來說並非真正需要。測試延遲的總時間成本約為 5 分鐘。然後，我們切換到使用 TypeScript 編譯器 API 的自訂僅轉譯解決方案。這快得多，但仍然需要約 2 分鐘。

在此里程碑中，我們切換到 SWC (Speedy Web Compiler)，它甚至更快。現在轉譯我們所有的 TypeScript 來源大約需要 12 秒。這是一個巨大的改進，可讓我們更快地獲得有關提取要求的意見反應。

值得注意的修正

  • 27799 macOS：OS 服務無法從編輯器中挑選選取的文字
  • 60821 改善最近開啟的項目與 [開始使用] 頁面最近清單之間的同步。
  • 156777 開啟處理程序瀏覽器時，每分鐘 5MB 的記憶體洩漏
  • 159862 在 macOS Catalina 上，當處於全螢幕模式時，交通號誌按鈕顯示未對齊
  • 161305 檢視其他 [視窗] 設定時，[視窗：標題列樣式] 連結無法運作

感謝您

最後但同樣重要的是，衷心感謝 VS Code 的貢獻者。

Issue 追蹤

對我們的 Issue 追蹤的貢獻

提取要求

對 vscode 的貢獻

對 vscode-css-languageservice 的貢獻

對 vscode-pull-request-github 的貢獻

對 debug-adapter-protocol 的貢獻