🚀 在 VS Code 中

2022 年 5 月 (版本 1.68)

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

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


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

如果您想要線上閱讀這些版本資訊,請前往 更新,網址為 code.visualstudio.com

Insiders 版本: 想要盡快試用新功能嗎?您可以下載每晚 Insiders 版本 組建,並在最新更新可用時立即試用。

工作台

設定顯示語言改進

已重新整理 設定顯示語言 命令以包含

  • 該語言的語言名稱。
  • 可用的語言 區段,顯示您的電腦上未安裝的語言,選取其中一種語言將自動安裝並套用該語言。

Configure Display Language dropdown with installed and available Language Packs in their language

佈景主題:Panda Theme

這應有助於探索可用的語言套件。請告訴我們您的想法!

問題面板表格檢視

在此里程碑中,我們為使用者新增了一項新功能,可在樹狀結構和表格之間切換問題面板的檢視模式。與樹狀檢視相比,表格會呈現每個問題的來源 (語言服務或擴充功能),讓使用者可以依來源篩選問題。

Problems panel table view

佈景主題:GitHub Dark Dimmed Theme

您可以使用問題面板右上角的 以表格檢視/以樹狀結構檢視 按鈕切換檢視 UI,或使用 問題:預設檢視模式 設定 (problems.defaultViewMode) 變更預設檢視模式

Problems panel View at Table button

已棄用的擴充功能

在此里程碑中,我們已在 VS Code 中新增對已棄用擴充功能的支援。擴充功能可以簡單地棄用,或為了另一個擴充功能而棄用,或者在其功能內建於 VS Code 中時棄用。VS Code 會在擴充功能檢視中將擴充功能呈現為已棄用,如下所示。

不再維護的已棄用擴充功能。

Deprecated extension with no maintenance

為了另一個擴充功能而棄用的擴充功能。在這種情況下,VS Code 不允許使用者安裝此擴充功能。

Deprecated extension with alternative

其功能內建於 VS Code 中的已棄用擴充功能,可透過設定啟用。

Deprecated extension with builtin to VS Code

VS Code 不會自動移轉或解除安裝已棄用的擴充功能。會有一個 移轉 按鈕引導您切換至建議的擴充功能。

Migrate deprecated extension

佈景主題:GitHub Dark Dimmed Theme

注意: 已棄用擴充功能清單由 VS Code 維護。如果您有您認為應該棄用的擴充功能,請在此討論中留言與我們聯絡。

贊助擴充功能

VS Code 現在允許使用者贊助他們最愛的擴充功能。當擴充功能可以贊助時,VS Code 將在擴充功能檢視詳細資料頁面中呈現 贊助 按鈕,如下所示

Sponsor extension button on Extensions view Details page

佈景主題:GitHub Dark Dimmed Theme

贊助 按鈕會將您導向擴充功能的贊助 URL,您可以在其中提供您的支援。請參閱 擴充功能贊助 以了解如何為您的擴充功能選擇加入此功能。

使用 .gitignore 隱藏檔案總管中的檔案

檔案總管現在支援剖析和隱藏 .gitignore 檔案排除的檔案。可以透過 檔案總管:排除 Git 忽略 (explorer.excludeGitIgnore) 設定啟用此功能。此設定與 files.exclude 一起運作,以在檔案總管中隱藏不想要的檔案。

注意:目前,無法剖析否定 glob,例如 !package.json

鎖定浮動提示位置

由於存在其他 UI 元素 (例如,捲軸),某些自訂浮動提示很難或無法滑鼠移至上方。在浮動提示處於作用中狀態時按住 Alt 鍵,現在會「鎖定」它,使其具有更寬的邊框,並防止滑鼠在浮動提示外部移動而隱藏它。這主要是協助工具功能,讓浮動提示能與螢幕放大鏡順利搭配運作,但對於從浮動提示複製文字也很有用。請注意,此功能僅適用於編輯器外部,因為編輯器浮動提示始終可以滑鼠移至上方,除非透過 editor.hover.sticky 設定另行指定。

設定編輯器改進

設定編輯器現在會顯示語言特定設定的預設值覆寫指標。您可以透過在設定編輯器搜尋列中新增語言篩選器來檢視語言特定設定,方法是明確輸入 (@lang:javascript),或按一下搜尋列右側的篩選器按鈕,然後選取 語言 選項。

當預設值覆寫指標出現時,表示語言特定設定的預設值已由擴充功能覆寫。指標也會指出哪個擴充功能覆寫了預設值。

佈景主題:Light Pink

此反覆運算也修正了設定編輯器中某些連結在設定編輯器搜尋列中已存在搜尋查詢時,無法正確重新導向的行為。連結現在也具有適當的樣式,因此當滑鼠游標停留在連結上方時會更清楚。

<video src="/assets/updates/1_68/settings-editor-working-links.mp4" autoplay loop controls muted title="在設定編輯器中搜尋「字型」一詞,並在目錄中選取終端機類別之後,會顯示設定 terminal.integrated.fontFamily,且其描述包含 editor.fontFamily 設定的連結。按一下連結現在會正確地將您帶到設定。">

佈景主題:Light Pink

註解小工具主要按鈕

註解小工具針對第一個 (最右邊) 動作使用主要按鈕色彩

Add Comment has the primary button color

終端機

尋找相符項背景顏色

上一個版本在終端機中實作的尋找功能,會顯示所有相符項周圍的邊框,但在動態變更儲存格背景的支援可用之前,這只是一個暫時的解決方案。彩色背景現在是佈景主題在醒目提示相符項時的預設值,且整體體驗應與編輯器類似。

Find now uses the blue from the editor's find for the active match and the orange for highlights

如果您是採用 terminal.findMatchBorderterminal.findMatchHighlightBorder 的佈景主題作者,我們建議您移轉至 terminal.findMatchBackgroundterminal.findMatchHighlightBackground,如果這更符合佈景主題或有助於對比。

對比度和最小對比度比率的改進

尋找相符項背景工作新增了終端機如何與背景和前景色彩搭配運作的更多彈性。因此,針對終端機中的對比度進行了改進,使終端機視覺效果更接近編輯器。此外,現在還有最小對比度比率功能,可動態變更文字的前景以協助提高可見度。

  • 如果未達到對比度,則亮度現在會朝另一個方向移動。例如,如果淺灰色背景上的深灰色文字未達到對比度,且為純黑色 (#_000000),則色彩也會嘗試朝白色移動,並使用最符合所需對比度比率的值。

    Darker grey on lighter dark can now use a light foreground color if needed

  • 停用 GPU 加速時,選取範圍現在會繪製在文字下方,並支援不透明色彩。先前,這必須是部分透明的,且會沖淡前景色彩。由於此變更,選取範圍色彩現在使用與編輯器中相同的色彩。

    Foreground color are retained in selections

  • Nerd 字型 符號現在應套用最小對比度比率,以與附近的文字混合,而 Powerline 符號和方塊繪圖字元將 不會 套用最小對比度比率,因為它們通常與相鄰的反轉儲存格相鄰,而沒有任何前景字元。

    Powerlines no longer have odd colors between the colored sections

  • 佈景主題現在可以指定固定選取範圍前景色彩,以在高度對比佈景主題中預設使用。

    The dark high contrast theme now uses black as its selection foreground

  • 修正了數個錯誤,使產生的前景色彩更正確。

提醒您,如果您偏好原始色彩,可以透過將 "terminal.integrated.minimumContrastRatio": 1 設定為停用最小對比度比率。

工作

預設工作的 Glob 模式

預設組建和測試工作現在可以限定範圍,僅當作用中檔案符合檔案名稱 glob 模式時才為「預設」

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "echo txt",
            "type": "shell",
            "command": "echo TextFile",
            "group": {
                "kind": "build",
                "isDefault": "**.txt" // This is a glob pattern which will only match when the active file has a .txt extension.
            }
        },
        {
            "label": "echo js",
            "type": "shell",
            "command": "echo JavascriptFile",
            "group": {
                "kind": "build",
                "isDefault": "**.js" // This is a glob pattern which will only match when the active file has a .js extension.
            },
        }
    ]
}

原始檔控制

Git 擴充功能進行了一些更新,與我們新的 提取要求流程 一致。

Git:分支前置詞

為了讓建立新分支的流程更順暢,有一個新的設定 git.branchPrefix,指定在建立新分支時要用作前置詞的字串。

Git:分支名稱產生

新的設定 git.branchRandomName.enable 會讓 VS Code 在每次建立新分支時建議隨機分支名稱。隨機名稱是從字典產生的,您可以透過 git.branchRandomName.dictionary 設定控制字典。支援的字典為:adjectives (預設)、animals (預設)、colorsnumbers

Git:分支保護

使用新的 git.branchProtection 設定,您可以設定要保護的特定分支。VS Code 會避免直接在受保護的分支上認可,並會提供您建立新分支以認可的機會。您可以使用 git.branchProtectionPrompt 設定微調此行為。

GitHub:Pull request 範本支援

GitHub 擴充功能現在了解提取要求範本,並會在每次從新分支的儲存庫建立 PR 時,將其用作基礎。

筆記本

儲存格顯示變更

我們已調整在幾種情況下如何顯示檢視區外部的儲存格。

當您按一下大綱檢視中的儲存格時,如果該儲存格在檢視區外部,筆記本現在會捲動以在大約檢視區頂端 1/5 的位置顯示該儲存格。這與文字編輯器中大綱的行為一致。

當游標位於儲存格編輯器中時,您可以將游標移過編輯器的第一行或最後一行,以將其移至下一個儲存格編輯器中。現在,當將游標移至其儲存格超出檢視區的編輯器時,筆記本會捲動到剛好足以顯示編輯器中該行的位置,而不是跳到上方以在檢視區中間顯示儲存格。

尋找和取代支援從游標/選取範圍植入查詢

筆記本編輯器中的尋找控制項現在支援從編輯器選取範圍植入搜尋字串。此行為由編輯器設定 editor.find.seedSearchStringFromSelection 控制。

偵錯

執行和偵錯,而無需 launch.json

當您尚未設定 launch.json 設定檔並按下 F5 鍵,或選取偵錯檢視中的 執行和偵錯 按鈕時,VS Code 會根據目前作用中檔案中的程式設計語言選取偵錯工具。如果您未開啟任何檔案,系統會詢問您要使用哪個偵錯工具。此體驗可能會讓人感到有些困惑,因此我們進行了一些改進。

Select debugger prompt before (alphabetical) and after (activated debugger at the top)

如果擴充功能在您嘗試開始偵錯之前已啟用,則該擴充功能的偵錯工具將排序到最上方。例如,當擴充功能先前透過從該擴充功能執行命令、開啟啟用該擴充功能的語言檔案,或透過您的工作區符合的 workspaceContains 模式啟用時,這可能會很有用。如果您在此工作階段中使用過偵錯工具,它也會排序到最上方。

Chrome/Edge 偵錯工具已重新命名為 Web 應用程式 (Chrome)Web 應用程式 (Edge),以盡量避免與其他偵錯工具 (例如 Flutter 擴充功能,也會在瀏覽器中執行應用程式) 混淆。

語言

TypeScript 4.7

VS Code 現在會組合 TypeScript 4.7.3。這個主要的 TypeScript 帶來了新的語言功能,包括 改良的控制流程分析 和對 Node.js 中 ECMAScript 模組支援 的支援。它也包含新的工具功能,並修正了許多重要的錯誤!

前往原始碼定義

VS Code 最長期存在且最多人投票的功能要求之一,是讓 VS Code 從外部程式庫巡覽至函式和符號的 JavaScript 實作。目前,前往定義 會跳到類型定義檔 (.d.ts 檔),該檔案定義目標函式或符號的類型。如果您需要檢查這些符號的類型或文件,這很有用,但會隱藏程式碼的實際實作。目前的行為也讓許多可能不了解來自 .d.ts 的 TypeScript 類型的 JavaScript 使用者感到困惑。

雖然將 前往定義 變更為巡覽至符號的 JavaScript 實作聽起來很簡單,但此功能要求已開啟這麼久是有原因的。JavaScript (尤其是許多程式庫隨附的編譯 JavaScript) 比 .d.ts 更難分析。嘗試分析 node_modules 下的所有 JavaScript 程式碼既緩慢也會大幅增加記憶體使用量。VS Code IntelliSense 引擎也無法理解許多 JavaScript 模式。

這就是新的 前往原始碼定義 命令的用途。當您從編輯器操作功能表或從命令面板執行此命令時,TypeScript 會嘗試追蹤符號的 JavaScript 實作並巡覽至該實作。這可能需要幾秒鐘,而且我們可能不一定會獲得正確的結果,但在許多情況下應該很有用。

我們正積極努力改進此功能,因此請在您的程式碼基底中試用它,並分享您的意見反應

物件方法程式碼片段

物件方法程式碼片段可協助您快速將方法新增至實作指定介面的物件常值

在物件常值內時,您應該會看到每個可能方法的兩個建議:一個只插入方法名稱,另一個插入方法的完整簽章。您也可以透過設定 "typescript.suggest.classMemberSnippets.enabled": false"javascript.suggest.classMemberSnippets.enabled": false 完全停用物件方法程式碼片段。

群組感知組織匯入

JavaScript 和 TypeScript 的 組織匯入 命令可讓您快速清除匯入清單。執行時,它會移除未使用的匯入,並依字母順序排序匯入。

但是,某些程式碼基底喜歡對其匯入的組織方式進行一定程度的手動控制。群組外部與內部匯入是其中一個最常見的範例

// local code
import * as bbb from './bbb';
import * as ccc from './ccc';
import * as aaa from './aaa';

// built-ins
import * as path from 'path';
import * as child_process from 'child_process';
import * as fs from 'fs';

// some code...

在舊版 VS Code 中,在此處執行 組織匯入 會產生下列結果

// local code
import * as child_process from 'child_process';
import * as fs from 'fs';
// built-ins
import * as path from 'path';
import * as aaa from './aaa';
import * as bbb from './bbb';
import * as ccc from './ccc';

// some code...

真糟糕!發生這種情況的原因是所有匯入都依字母順序排序,而且 VS Code 甚至嘗試在執行此作業時保留註解和換行符號。

不過,在 TypeScript 4.7 中,組織匯入 現在是群組感知的。在上述程式碼上執行它看起來更像您預期的樣子

// local code
import * as aaa from './aaa';
import * as bbb from './bbb';
import * as ccc from './ccc';

// built-ins
import * as child_process from 'child_process';
import * as fs from 'fs';
import * as path from 'path';

// some code...

請注意,匯入現在已排序,同時仍保留在其群組內。好多了!

在隱含專案中啟用嚴格的 Null 檢查

預設會針對 JavaScript 和 TypeScript 在隱含專案中啟用嚴格的 Null 檢查。這應會產生更精確的 IntelliSense 和改良的類型檢查,可以捕捉常見的程式設計錯誤。

A strict null error. getElementById may return null if no element with the ID exists

這項新行為僅適用於不屬於 jsconfigtsconfig 專案的任何檔案。您可以透過設定停用它:"js/ts.implicitProjectConfig.strictNullChecks": false。對於屬於 jsconfigtsconfig 的檔案,您仍然需要在組態檔中啟用嚴格的 Null 檢查。

您現在可以在 Markdown 檔案中的參考連結上使用 前往定義。這會從參考跳到目前檔案中的連結定義。

擴充的 JSON 結構描述支援

內建 JSON 語言服務已改進對 JSON 結構描述草稿 2019-09JSON 結構描述草稿 2020-12 的支援。使用這類結構描述時,不再顯示警告。

仍有一些功能未完全支援。當結構描述使用它們時,會顯示警告。不支援的屬性為

  • 具有 $id 的子結構描述
  • $recursiveRef/Anchor (草稿 2019-09)
  • $dynamicRef/Anchor (草稿 2020-12)

適用於網頁的 VS Code

核心在地化支援

我們已針對適用於網頁的 VS Code 導入初始在地化支援。VS Code 在世界各地廣泛使用,對於許多使用者來說,英文不是他們的第一語言 (或他們熟悉的語言!)。多年來,VS Code 使用者一直在安裝 Marketplace 中的語言套件,以便使用英文以外的語言使用 VS Code。對於適用於網頁的 VS Code,我們決定採取不同的方法,這種方法更符合現今網頁的運作方式。

對於將瀏覽器設定為我們核心支援語言之一的使用者,vscode.dev 將自動套用該語言的翻譯。我們支援的語言記錄在 vscode-loc 儲存庫中。

例如,若要在 Microsoft Edge 中設定顯示語言,您可以使用 設定 > 語言

Microsoft Edge Settings Languages page

設定完成後,當您前往 vscode.dev (或 insiders.vscode.dev) 時,將以德文顯示

vscode.dev in a browser displayed in German

佈景主題:Panda Theme

在接下來的幾個月內,我們將為擴充功能啟用在地化 (包括 VS Code 隨附的擴充功能和未隨附的擴充功能),以便擴充功能作者也可以支援非英語系使用者。敬請期待!

遠端儲存庫

當使用 遠端儲存庫 > 繼續在...上工作 命令在本機複製 GitHub 或 Azure Repos 儲存庫,並在桌面 VS Code 中開啟時,您現在可以設定 remoteHub.gitProtocol 以始終使用 httpssh URL 進行複製。

開發容器規格

Microsoft 和 GitHub 的開發容器團隊繼續積極開發新的 開發容器規格,而此反覆運算有幾個令人興奮的重點。

參考實作

我們發行了開放原始碼命令列介面 (CLI) 作為規格的參考實作。CLI 從 devcontainer.json 建置並啟動開發容器,可以直接使用或整合到產品體驗中。

CLI 可在新的 devcontainers/cli 儲存庫中取得。您可以從其 README 了解如何開始使用,並在此 部落格文章 中閱讀更多資訊。

CLI 正在積極開發中,並將繼續發展,以更好地支援更多案例,例如更廣泛地支援個別使用者。我們很樂意在過程中聽到您的意見反應,因此我們開啟了一個問題,專門徵求有關 CLI 的意見反應,並歡迎在儲存庫中提出其他問題和 PR。

CI 中的開發容器

GitHub Action 和 Azure DevOps 工作可用於在持續整合 (CI) 組建中執行儲存庫的開發容器。這可讓您重複使用與本機開發相同的設定,以在 CI 中建置和測試您的程式碼。請參閱 devcontainers/ci README 以取得更多詳細資料。

GitHub Action 的範例用法

- name: Build and run dev container task
  uses: devcontainers/ci@v0.2
  with:
    imageName: ghcr.io/example/example-devcontainer
    runCmd: make ci-build

Azure DevOps 工作的範例用法

- task: DevcontainersCI@0
  inputs:
    imageName: 'yourregistry.azurecr.io/example-dev-container'
    runCmd: 'make ci-build'
    sourceBranchFilterForPush: refs/heads/main

規格

規格的積極開發仍在繼續,我們已在 devcontainers/spec 儲存庫中發佈了初始版本。

與 CLI 一樣,請隨時關注進一步的更新和進展,我們很樂意聽到您的意見反應。

延伸閱讀

您可以在 https://containers.dev 閱讀所有關於開發容器和規格的資訊。

擴充功能貢獻

Python

啟動時不進行解譯器探索

Python 擴充功能現在僅在以下情況下自動觸發探索

  • 使用 Python:選取解譯器 命令選擇不同的解譯器。
  • 第一次開啟特定範圍 (工作區或全域)。
  • 未安裝 Python。

由於探索不會在啟動時自動觸發,因此會導致立即載入,並加快語言伺服器等其他功能的啟動速度。但是,如果已安裝/啟用 Jupyter 擴充功能,則探索仍會在啟動時由 Jupyter 觸發。

啟用在地化

Python 擴充功能現在支援 VS Code 支援的所有語言的翻譯。我們已更新我們取得命令、通知、標題等翻譯的方式,使用 vscode-nls。這些翻譯由在地化團隊維護,以確保它們是最新的且正確。

Jupyter

網頁擴充功能

我們已在支援 Jupyter 擴充功能網頁版本中的更多核心功能方面取得進展。

本月,以下功能已移植到網頁擴充功能

  • https 支援
  • 核心完成
  • ipywidgets
  • 筆記本偵錯
  • 變數檢視
  • 匯出
  • 互動式視窗

如果您想要試驗此功能,請從本機電腦啟動 Jupyter,並使用

jupyter notebook --no-browser --NotebookApp.allow_origin_pat=https://.*\.vscode-cdn\.net

然後使用 vscode.dev 中的 Jupyter:指定 Jupyter 伺服器以進行連線 命令連線到它。

如需詳細資訊 (和留言),請參閱此討論 項目

遠端開發

持續進行 遠端開發擴充功能 的工作,這可讓您使用容器、遠端電腦或 適用於 Linux 的 Windows 子系統 (WSL) 作為功能完整的開發環境。

您可以在遠端開發版本資訊中了解新的擴充功能功能和錯誤修正。

GitHub Pull Requests 和 Issues

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

  • 建立提取要求 檢視中的自動合併核取方塊

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

遠端儲存庫擴充功能

GitHub 儲存庫Azure Repos 擴充功能都支援 VS Code 支援的所有語言的翻譯。

預覽功能

當您使用 Markdown 時,很容易不小心加入無效的檔案連結或圖片參考。可能是您忘記檔名使用的是 - (破折號) 而不是 _ (底線),或者您連結的檔案被移動到不同的目錄。通常您只在檢視 Markdown 預覽,甚至發布之後才發現這些錯誤。VS Code 全新的實驗性 Markdown 連結驗證功能可以協助您抓到這些錯誤。

透過連結驗證,VS Code 將會分析 Markdown 中指向標題、圖片和其他本機檔案的連結。無效的連結會被回報為警告或錯誤。

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

VS Code 甚至可以抓到指向其他 Markdown 檔案中特定標題的無效連結!

連結驗證預設為關閉。您可以設定 "markdown.experimental.validate.enabled": true 來試用連結驗證功能。

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

  • markdown.experimental.validate.fileLinks.enabled - 啟用/停用本機檔案連結的驗證:[link](/path/to/file.md)

  • markdown.experimental.validate.headerLinks.enabled - 啟用/停用目前檔案中標題連結的驗證:[link](#_some-header)

  • markdown.experimental.validate.referenceLinks.enabled - 啟用/停用參考連結的驗證:[link][ref]

  • markdown.experimental.validate.ignoreLinks - 略過驗證的連結清單。如果您連結到磁碟上不存在但發布 Markdown 後會存在的檔案,這會很有用。

請告訴我們您對新功能的看法!

我們新增了實驗性支援,可讓您貼上內容以在 Markdown 中插入圖片或檔案連結。

這需要同時啟用 markdown.experimental.editor.pasteLinks.enabled"editor.experimental.pasteActions.enabled"。您目前可以從 VS Code 檔案總管複製檔案。貼上圖片檔案會插入圖片參考,而貼上一般文字檔則會插入指向這些檔案的連結。

終端機 shell 整合

Shell 整合(透過 terminal.integrated.shellIntegration.enabled 設定啟用)和命令裝飾在本迭代中已獲得完善和改進。

部分更新包含

  • 146377 持續保存 shell 狀態,讓 bash-git-prompt 和其他程式可以運作
  • 148635 允許為 zsh 使用自訂的 ZDOTDIR
  • 145801 修正裝飾在較慢的電腦上失去同步的問題
  • 146873 改善 bash 中現有偵錯陷阱的處理方式
  • 148839 完善與這是如何運作?命令和索引標籤懸停中的啟用狀態的訊息傳遞
  • 151223 在清除緩衝區後,確保正確追蹤命令

Windows 上的視窗控制項覆蓋

我們已採用 Electron 提供的 API,以支援 Windows 上的 視窗控制項覆蓋。此變更對使用者而言的主要優點是可以存取 Windows 11 中的 貼齊版面配置 功能。由於某些 持續存在的問題,視窗控制項覆蓋預設為關閉,但您可以使用實驗性設定 window.experimental.windowControlsOverlay.enabled 將其開啟。

Hover over the maximize/restore window control to see Windows 11 Snap layouts

命令中心

我們正在新增命令中心 - 一種更簡單的方式來觸發檔案、命令等的快速選取。

Command Center in the VS Code title bar

可以透過 window.experimental.commandCenter 設定啟用此功能,並讓我們知道您的想法。

合併編輯器

我們已開始著手改善合併體驗。目前仍處於早期階段,我們尚未準備好徵求意見反應,但您可以透過 git.experimental.mergeEditor 試用。啟用此功能後,具有合併衝突的檔案會在新的合併編輯器中開啟,以簡化衝突解決。

我們將繼續努力改善此功能。使用 Insiders 以追蹤我們的進度。我們衷心感謝 Mingpan 和 Google 的朋友們協助我們完成這項工作。❤️

擴充功能撰寫

行內完成功能最終確定

我們已最終確定行內完成 API。這讓擴充功能能夠提供與建議小工具分離的行內完成。行內完成的呈現方式就好像已被接受一樣,但以灰色呈現。使用者可以循環瀏覽建議,並使用 Tab 鍵接受建議。使用行內完成功能的擴充功能範例是 GitHub Copilot。如需更多資訊,請參閱 vscode.d.ts 檔案,API 的進入點為 languages.registerInlineCompletionItemProvider

InputBox 驗證訊息嚴重性最終確定

我們的 InputBox API(透過 window.showInputBoxwindow.createInputBox在使用者輸入驗證中提供嚴重性的功能已最終確定。

例如,如果您想要根據使用者的輸入向使用者顯示資訊訊息,您的驗證訊息可以傳回

{
  message: 'this is an info message';
  severity: InputBoxValidationSeverity.Info;
}

看起來會像這樣

Input box with 'this is an info message' severity message

筆記本編輯器 API

新的筆記本編輯器 API 引入了新的 NotebookEditor 類型,它類似於 TextEditor,但適用於 筆記本 而非一般的文字編輯器。

const editor = vscode.window.activeNotebookEditor;
if (editor) {
  // Access the underlying notebook document associated with the editor
  console.log(editor.notebook.uri);

  // Change the selection in the current notebook
  editor.selection = new vscode.NotebookRange(1, 3);
}

您可以使用 window.activeNotebookEditor 來取得目前的筆記本編輯器,以及諸如 window.onDidChangeActiveNotebookEditor 等事件,以觀察使用者何時切換到新的筆記本編輯器。

根據時間軸檢視的擴充功能啟動

新增了一個新的啟動事件,用於在時間軸檢視可見時觸發。任何擴充功能都可以使用此事件 onView:timeline,但對於實作建議的 Timeline API 的擴充功能最有用。

UX 指南

擴充功能作者的 UX 指南已更新和擴充,以涵蓋更多 VS Code 使用者介面元素。

UX Guideline example image pointing to View Actions elements

修訂後的 概觀頁面逐步說明 VS Code UI,以提供介面和常見 UI 元素的視覺導覽。

相關指南、API 參考和擴充功能範例的連結已新增至每個區域的專用頁面。此外,所有範例圖片已在指南中更新,以展示最新版本的 UI。

您現在可以閱讀有關擴充功能新增或貢獻這些 UI 元素的建議做法與禁止事項

擴充功能贊助

在此里程碑中,我們在擴充功能的 package.json 中引入了 sponsor 欄位,以允許擴充功能選擇加入贊助。sponsor 物件具有 url 欄位,用於擴充功能作者的贊助連結。例如

"sponsor": {
    "url": "https://github.com/sponsors/nvaccess"
}

如果擴充功能選擇加入此功能,VS Code 將在擴充功能檢視的詳細資料頁面中呈現一個 贊助 按鈕,如上方的 贊助擴充功能 章節所示。

注意: 請務必使用最新的 vsce 命令列工具 (>=2.9.1) 發布已啟用贊助的擴充功能。

建議的 API

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

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

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

從 DataTransfer 讀取檔案

新的 dataTransferFiles API 建議讓擴充功能可以從 vscode.DataTransfer 物件讀取檔案。樹狀結構拖放 API 以及拖放到編輯器和複製貼上 API 建議都使用了 DataTransfer 類型。

export class TestViewDragAndDrop implements vscode.TreeDataProvider<Node>, vscode.TreeDragAndDropController<Node> {

  ...

   public async handleDrop(target: Node | undefined, sources: vscode.DataTransfer, token: vscode.CancellationToken): Promise<void> {

     // Get a list of all files
     const files: vscode.DataTransferFile[] = [];
     sources.forEach((item) => {
       const file = item.asFile();
       if (file) {
         files.push(file);
       }
     });

    const decoder = new TextDecoder();

    // Print out the names and first 100 characters of the file
     for (const file of files) {
       const data = await file.data();
       const text = decoder.decode(data);
       const fileContentsPreview = text.slice(0, 100);
       console.log(file.name + ' — ' + fileContentsPreview + '\n');
     }

    ...
  }
}

檔案資料傳輸項目目前僅在它們來自 VS Code 外部時(例如,當您從桌面拖放到樹狀檢視或編輯器中時)才會新增到 DataTransfer

複製貼上 API

新的 documentPaste API 建議讓擴充功能可以掛勾到文字編輯器內的複製和貼上動作。這可以用於修改貼上時插入的文字。您的擴充功能也可以在複製文字時儲存中繼資料,並在貼上時使用此中繼資料(例如,在兩個程式碼檔案之間貼上時帶入 import)。

文件貼上擴充功能範例展示了此 API 的實際運作方式

/**
 * Provider that maintains a count of the number of times it has copied text.
 */
class CopyCountPasteEditProvider implements vscode.DocumentPasteEditProvider {
  private readonly countMimeTypes = 'application/vnd.code.copydemo-copy-count';

  private count = 0;

  prepareDocumentPaste(
    _document: vscode.TextDocument,
    _range: vscode.Range,
    dataTransfer: vscode.DataTransfer,
    _token: vscode.CancellationToken
  ): void | Thenable<void> {
    dataTransfer.set(this.countMimeTypes, new vscode.DataTransferItem(this.count++));
  }

  async provideDocumentPasteEdits(
    _document: vscode.TextDocument,
    range: vscode.Range,
    dataTransfer: vscode.DataTransfer,
    token: vscode.CancellationToken
  ) {
    const countDataTransferItem = dataTransfer.get(this.countMimeTypes);
    if (!countDataTransferItem) {
      return undefined;
    }

    const textDataTransferItem = dataTransfer.get('text/plain') ?? dataTransfer.get('text');
    if (!textDataTransferItem) {
      return undefined;
    }

    const count = await countDataTransferItem.asString();
    const text = await textDataTransferItem.asString();

    // Build a snippet to insert
    const snippet = new vscode.SnippetString();
    snippet.appendText(`(copy #${count}) ${text}`);

    return new vscode.SnippetTextEdit(range, snippet);
  }
}

vscode.languages.registerDocumentPasteEditProvider(
  { language: 'markdown' },
  new CopyCountPasteEditProvider()
);

新的筆記本工作區編輯建議

新的 notebookWorkspaceEdit API 建議允許擴充功能編輯筆記本的內容。它取代了先前的 notebookEditorEdit 建議。

透過此建議,您可以建立工作區編輯,以在筆記本中插入、取代或修改儲存格

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

  edit.set(
    currentNotebook.uri,
    vscode.NotebookEdit.insertCells(/* index*/ 1, [
      // ... new notebook cell data
    ])
  );

  await vscode.workspace.applyEdit(edit);
}

工程

使用提取請求

我們已不再直接將變更推送至 vscode 儲存庫的 main 分支,現在完全改用提取請求 (PR) 將所有變更推送至 VS Code。我們要求每個 PR 都必須獲得至少一位其他團隊成員的核准。利用這一點,我們現在也要求在 PR 可以合併之前,必須通過一些基本檢查。這些任務包括 TypeScript 編譯、格式化規則、單元測試和整合測試,通常不會超過 10 分鐘。切換到此流程減少了我們的 Insiders 組建因程式設計錯誤而損壞的次數。

VS Code OSS 組建

我們有一個新的公開 Code OSS 組建,它重複使用與我們的生產組建相同的組建定義。此組建現在在每個 PR 上都可以在 30 分鐘內執行完畢,我們計劃繼續投入以加速其執行速度。

文件

更新的版本控制影片

重新製作了 搭配 Visual Studio 使用 Git 的簡介影片,以協助您開始使用 VS Code 內建的 Git 整合功能。

您也可以在 VS Code YouTube 頻道上找到其他很棒的影片。

code.visualstudio.com 上的 vscode.dev

想要使用 VS Code for the Web 但忘記了網址?vscode.dev 現在顯著地顯示在 VS Code 下載 頁面上,讓您可以快速開始在瀏覽器中執行 VS Code。

vscode.dev on the code.visualstudio.com download page

重大修正

  • 141157 在非偵錯模式下按 F11 會開啟偵錯,而不是進入全螢幕
  • 148864 TypeScript 檔案的未繫結中斷點
  • 149638 延遲變數評估按鈕導致節點之間出現問題的間隙和未對齊

謝謝

最後但同樣重要的是,非常感謝 VS Code 的貢獻者。

網頁擴充功能

啟用以 網頁擴充功能形式執行程式碼的擴充功能作者(以下清單為 2022 年 5 月 2 日至 6 月 6 日之間)

Issue 追蹤

對我們的 issue 追蹤的貢獻

提取請求

vscode 的貢獻

vscode-extension-samples 的貢獻

vscode-generator-code 的貢獻

vscode-html-languageservice 的貢獻

vscode-js-debug 的貢獻

vscode-languageserver-node 的貢獻

vscode-pull-request-github 的貢獻

  • @jpspringall: Issue #3371 | 在 GitHub Enterprise AuthProvider 的情況下更新 getAuthSessionOptions PR #3565

debug-adapter-protocol 的貢獻

language-server-protocol 的貢獻