2022年9月(版本1.72)

下载:Windows: x64 Arm64 | Mac: Universal Intel silicon | Linux: deb rpm tarball Arm snap

更新 1.72.1: 此更新解决了这些安全问题

更新 1.72.2: 本次更新解决了这些问题


欢迎来到2022年9月发布的Visual Studio Code。此版本中有许多更新,我们希望您会喜欢,一些关键亮点包括:

如果您想在线阅读这些发布说明,请访问更新code.visualstudio.com上。

内部人员:想要尽快尝试新功能吗?您可以下载每晚的内部人员版本,并在更新可用时立即尝试最新更新。

工作台

隐藏工具栏中的操作

您现在可以从工具栏中隐藏操作。右键单击工具栏中的任何操作,然后选择其隐藏命令或任何切换命令。隐藏的操作将被移动到... 更多操作菜单中,并可以从那里调用。要恢复菜单,请右键单击工具栏按钮区域并选择重置菜单命令。要恢复所有菜单,请从命令面板运行重置所有菜单⇧⌘P (Windows, Linux Ctrl+Shift+P))。

在下面的视频中,GitLens 扩展的 文件注释 菜单从编辑器工具栏中隐藏,然后通过 重置菜单 恢复。

合并编辑器

选择使用三方合并编辑器

在审查了我们收到的所有合并编辑器反馈并整体考虑了用户体验后,我们决定在检测到冲突时默认不显示三方合并编辑器(git.mergeEditor 设置现在为 false)。这一决定的理由可以在 issue #160806 中找到。

对于有冲突的文件,用户现在可以选择在合并编辑器中解决来打开三方合并编辑器:

一个显示冲突文件的截图,展示“在合并编辑器中解决”按钮

CodeLens 用户界面

用户反馈表明复选框存在一些用户体验问题。复选框不太容易被发现,并且由于未能正确表示所有可能的状态,导致了一些混淆。在此次迭代中,我们切换到了使用文本标签(接受传入接受当前接受两者)的CodeLens用户界面:

合并编辑器之前带有复选框和之后带有CodeLens

我们将继续迭代这个设计,并密切关注我们收到的所有反馈。

从头重新计算的结果文件

在上一次迭代中,我们尝试将合并编辑器设计为具有冲突文件的替代视图。与显示冲突标记不同,单独的编辑器窗格显示了冲突的详细信息。这种设计的优点是,打开合并编辑器不会修改磁盘上的文件,并且用户在打开合并编辑器之前所做的更改可以保留。不幸的是,这不仅令人困惑,而且在所有情况下都不起作用,因为我们的合并算法和Git合并算法并不完全一致。

在此版本中,如果在合并编辑器中打开带有冲突标记的文件,作为第一步,我们使用合并算法重新计算结果文件,而不插入任何冲突标记。单边冲突会自动解决,而适当的冲突会重置为两个版本的共同祖先,并标记为未处理

基础视图

合并编辑器现在有一个单独的基础视图,可以用来将任何一侧与共同祖先进行比较。

树视图查找控件改进

你现在可以垂直移动树视图中的查找控件,以便访问其后面的UI元素。在树视图中按下⌥⌘F (Windows, Linux Ctrl+Alt+F)以显示查找控件。

树视图查找控件支持垂直移动

此外,树视图查找控件在重新打开时会记住上次的搜索词。

树视图查找控件记住上次搜索文本

某些音频和视频文件的内置预览

VS Code 现在支持预览一些音频和视频文件格式:

在VS Code中预览MP4视频

目前支持以下音频格式:

  • 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 在编辑其应用程序文件夹文件时发出警告

编辑器

改进的自动滚动行为

在选择和拖动时,编辑器过去以依赖于显示器每秒帧数(FPS)的方式滚动,有时当鼠标到达编辑器边缘时,编辑器会快速滚动。现在,当鼠标接近边缘时,编辑器以每秒大约一个视口的速度自动滚动,当鼠标远离编辑器时,滚动速度更快,且与FPS无关。

在下面的视频中,滚动速度随着鼠标光标向下移动远离编辑器而增加。

改进的悬停效果

编辑器悬停过去在隐藏自己方面非常激进,尤其是当鼠标悬停在编辑器的空白区域时。这使得很难触及悬停中显示的一些操作。现在,只要鼠标朝悬停移动,悬停就会保持可见。设置 "editor.hover.sticky": false 可以恢复到之前的行为。

在右侧的“之后”视频中,从悬停中选择快速修复要容易得多:

新代码操作组

代码操作控制中有两个新的组可用,InlineMove

这些组对应于refactor.inlinerefactor.move代码操作类型。

新代码操作颜色

你可能会注意到,代码操作控件在这次迭代中也看起来有些不同。样式已更新为使用更合适的主题颜色。最大的变化是控件主体现在使用editorWidget.*颜色而不是menu.*

我们仍在完善这些颜色,所以如果它们与某个主题不兼容,或者缺少任何颜色自定义选项,请告诉我们。

扩展

最近更新的扩展

VS Code 现在在扩展视图的更新部分中显示过去7天内更新的扩展,位于最近更新部分。

扩展视图中的最近更新部分

需要关注的扩展

VS Code 现在将需要关注的扩展显示在 扩展 视图的默认 已安装 部分的顶部。这包括有待更新的扩展、已更新或已禁用并需要 VS Code 重新加载的扩展。

需要关注的扩展显示在扩展视图的顶部

活动栏中扩展图标上的徽章现在显示需要关注的扩展数量。

扩展徽章显示有四个扩展需要关注

忽略扩展的更新

您现在可以通过点击更新下拉菜单中的忽略更新按钮来忽略扩展的更新。这将从需要关注的扩展列表中移除该扩展。

扩展视图上下文菜单中的忽略更新选项

您可以通过取消选中相同的忽略更新按钮来撤销此操作。

在扩展视图上下文菜单中选中忽略更新选项

请注意,安装特定版本的扩展(通过安装其他版本)也将忽略该扩展的更新。

已安装扩展的排序

您现在可以按安装次数评分名称发布日期更新日期对已安装的扩展列表进行排序。

扩展视图排序方式菜单选项

结果显示为树状视图

您现在可以以树状形式查看搜索结果!只需点击搜索视图顶部角落的列表/树图标,即可在列表视图和树状视图之间切换。

搜索结果以树状视图显示

主题: Night Owl Light (在 vscode.dev 上预览)

文件装饰设置

在搜索结果中,现在可以切换显示反映文件状态的文件名徽章和颜色。设置位于搜索 > 装饰:徽章 (search.decorations.badges) 和 搜索 > 装饰:颜色 (search.decorations.colors)。

搜索结果文件装饰设置

主题: Night Owl Light (在 vscode.dev 上预览)

源代码控制

发现嵌套的Git仓库

为了解决一个长期存在的功能请求,在这个里程碑中,我们对仓库发现进行了更改,以增加对嵌套Git仓库的支持。根据嵌套仓库的位置,您可能需要修改git.repositoryScanMaxDepth设置(默认值为1级)。

添加对带有密码的SSH密钥的支持

当使用带有密码的SSH密钥进行Git操作时,VS Code现在将显示快速输入控件,以便您可以输入SSH密钥的密码。密码不会被缓存,每次执行Git操作时都必须输入。

在检出前拉取

在这个里程碑中,我们添加了一个新的设置,git.pullBeforeCheckout,以简化切换分支的过程。当启用此设置时,如果没有未提交的更改,我们将在检出分支之前从远程拉取并快进分支。

仓库获取改进

对于具有多个远程仓库的Git仓库,现在调用fetch命令将显示一个快速选择列表,其中包含所有远程仓库的列表。用户可以选择特定的远程仓库进行拉取,或者从所有远程仓库拉取。

中止合并命令

有一个新命令,Git: Abort Merge,用于中止当前正在进行的合并操作。

终端

终端快速修复

我们正在推出一个由shell集成驱动的新功能,称为快速修复。此功能附带音频提示支持。使用audioCues.terminalQuickFix启用它,以便在有可用修复时听到提示音。

当命令映射到用户可能采取的一组操作时,可以使用快速修复,并且可以通过在编辑器中使用的相同键绑定Ctrl+.Cmd+.来激活。

以下是初始支持的快速修复:

Git 相似命令

当Git命令输入错误时,快速修复会建议类似的命令。

运行:当git sttatus拼写错误时,建议使用git status

Git 设置上游

当执行git push并且没有上游远程时,快速修复建议使用上游远程参数进行推送。

运行:建议使用 git push set upstream

Git 创建 PR

当分支首次推送到远程时,快速修复建议打开链接以创建PR。

提供了一个打开GitHub PR链接的操作

空闲端口

当使用已被占用的端口启动服务器时,快速修复提供了一个操作来终止进程并释放端口。

服务器启动失败,出现端口3000被占用的错误。提供了释放端口3000的操作。

Shell集成改进

对shell集成的以下改进已实现:

  • 运行最近的命令转到最近的目录 现在会在行有内容时(或无法可靠确定时)清除该行。
  • 移除了bash脚本中对$PREFIX环境变量的使用,这可能会与某些构建工具发生冲突。
  • 优化了zsh脚本,修复了一些关于$ZDOTDIR的边缘情况。
  • 在多个用户共享的机器上更好地处理zsh shell集成。

从应用程序发送的超链接现在在终端中得到了支持。这些超链接允许显示指向URL的标签,并以虚线形式下划线显示:

终端中的超链接显示为虚线,悬停在超链接上会显示URL

这里有一个示例,展示了如何编写一个带有标签“VS Code”的链接,指向https://code.visualstudio.com

printf '\e]8;;https://code.visualstudio.com\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) - 此属性决定DECSEDDECSEL是否可以擦除内容。

音频铃声

终端中的音频铃声现在可以正常工作,并且可以通过terminal.integrated.enableBell启用。

终端文档

终端文档已经重构并移动到VS Code 网站上的自己的目录中。

现在有针对以下主题的内容:

  • Terminal Basics - 快速了解 VS Code 集成终端。
  • Terminal Profiles - 了解如何通过配置文件自定义终端。
  • Shell Integration - VS Code 可以提供诸如命令状态、历史和快速导航等功能。
  • Appearance - 修改终端文本和光标样式及颜色。
  • Advanced - 高级支持自定义键绑定以及Unicode和表情符号字符。

希望您能在需要时轻松找到正确的文档。

任务

固定运行任务条目

任务可以固定在任务:运行任务列表中,以便更快更轻松地访问。

置顶项是运行任务列表中的顶部类别

任务完成声音

任务在完成时播放声音,以实现多任务处理并提高可访问性。通过audioCues.taskCompleted设置配置音频提示。

语言

在使用Markdown时,很容易错误地添加无效的文件链接或图片引用。也许你忘记了文件名使用了-(破折号)而不是_(下划线),或者你链接的文件被移动到了不同的目录。通常你只有在查看Markdown预览或发布后才会发现这些错误。VS Code的新Markdown链接验证功能可以帮助捕捉这些错误。

要开始使用,请设置"markdown.validate.enabled": true。VS Code 现在将分析 Markdown 链接到标题、图像和其他本地文件。无效的链接将被报告为警告或错误。

编辑器在链接到不存在的文件时显示的警告

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 - 一个跳过验证的链接全局模式列表。如果你链接到磁盘上不存在但在Markdown发布后存在的文件,这将非常有用。

试试看,让我们知道您对新功能的看法!

Reference links 使得在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

新的组织链接定义 代码操作 (source.organizeLinkDefinitions) 用于Markdown文件,它将所有链接定义分组到文件底部,按字母顺序排序,并删除任何未使用的链接定义。可以使用源操作命令来运行此功能。

例如,在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 规则。

笔记本

Notebook JavaScript 输出现在作为模块进行评估

在笔记本中的JavaScript输出现在被视为一个模块。这意味着在输出内部声明的变量将不再泄漏到其他输出中(对于const变量,甚至可能阻止具有冲突变量名称的其他输出运行)。

这也意味着你现在可以在 JavaScript 输出中使用 import

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

console.log(myFunction());

笔记本大纲中支持的HTML标题

Markdown 单元格中的 HTML 标题现在可以在笔记本的大纲视图中检测和呈现。

笔记本Markdown单元格中的HTML标题

网页版VS Code

浏览器地址栏中的'code'

现在有一个Chrome/Edge浏览器扩展,可以更轻松地在vscode.dev中打开您的GitHub仓库。

开始使用:

  1. 从Chrome网上应用店安装扩展程序。
  2. 在浏览器搜索栏中输入code 以激活全能框。
  3. 按名称搜索 GitHub 仓库并按下 Enter。建议由您的浏览器搜索历史填充,因此如果您想要的仓库没有出现,您也可以输入完整的 / 名称来打开它,例如 microsoft/vscode

在下面的视频中,用户通过在vscode.dev中输入code vscode来打开microsoft/vscode仓库。

这个扩展的灵感来自于Goto GitHub Repo Chrome扩展,该扩展由前VS Code团队成员Pine Wu创建,我们对此表示非常感谢。

切换开发环境时带上你的更改

当您浏览GitHub或Azure Repos仓库时,例如https://vscode.dev/github/microsoft/vscode,您可以使用继续工作命令选择不同的开发环境与您的仓库一起使用。

以前,如果您在虚拟工作区中有未提交的更改,您需要将它们推送到GitHub或Azure Repos以在其他地方查看。在这个里程碑中,我们已将编辑会话集成到继续工作功能中,以便您的未提交更改自动随您一起转移到目标开发环境,例如GitHub代码空间:

在下面的视频中,用户在使用VS Code for the Web时对JavaScript文件所做的更改在他们创建并切换到新的GitHub codespace工作时被应用。

随着此版本的发布,当您首次使用继续工作功能并存在未提交的更改时,您将可以选择使用编辑会话将您的编辑内容带到您选择的开发环境中,该功能使用VS Code服务来存储您的待处理更改。这些更改一旦应用到您的目标开发环境中,就会从我们的服务中删除。如果您选择在没有未提交更改的情况下继续,您可以通过配置"workbench.editSessions.continueOn": "prompt"设置来随时更改此偏好。

提示在使用继续工作时带上工作更改

当您使用VS Code网页版时,未提交的更改将在您使用继续工作时随您一起移动:

  • GitHub Codespaces 中新的云托管环境
  • 您GitHub仓库的新本地克隆
  • 一个本地 VS Code 实例,具有相同的虚拟 GitHub 仓库

当你在桌面版 VS Code 中使用 Remote Repositories 扩展时,未提交的更改会在你使用 继续工作 时随你一起移动:

  • GitHub Codespaces 中的云托管环境(可通过 GitHub Codespaces 扩展使用)
  • 您GitHub仓库的新本地克隆
  • 在容器卷中克隆你的GitHub仓库的新副本(可通过Dev Containers扩展使用)
  • https://vscode.dev
  • 包含您仓库克隆的现有本地文件夹

问题报告

问题字符数阈值增加到7500个字符

当使用内置的问题报告器来报告VS Code或扩展的问题时,用于在github.com上打开问题的URL中的字符数量是有限制的。如果你达到了这个限制,你会在问题正文中看到一条消息,内容是We have written the needed data into your clipboard because it was too large to send. Please paste.。不幸的是,一些用户没有注意到这条消息,并忘记将数据粘贴到问题正文中。

这个里程碑,我们已经将阈值增加到7500个字符。这是因为:

  1. 某些对URL中字符数量有严格限制的浏览器不再受支持(EOL)。
  2. GitHub 对 URL 中的字符数量有自己的限制。

这几乎使URL中包含的字符数量增加了三倍,这对于大多数用户来说应该是足够的,剪贴板消息将更少显示。

与运行扩展编辑器一起使用的问题报告器

如果您使用命令Developer: Show Running Extensions打开Running Extensions编辑器并选择Report Issue按钮,它将显示内置的问题报告器。以前,这会带您到GitHub问题页面并要求您粘贴,这在扩展仓库中创建了许多不必要且质量低的问题。现在,扩展的Report Issue按钮通过内置的问题报告器,让用户提交高质量的扩展问题。

对扩展的贡献

远程开发

远程开发扩展允许您使用开发容器、远程机器或Windows子系统Linux(WSL)作为全功能的开发环境。

我们已经听到了您关于Remote - WSLRemote - Containers扩展命名的反馈。我们原本希望名称中的Remote表示您在“远程”或“独立”的WSL发行版或开发容器中进行开发,而不是传统的本地开发。然而,这种“远程”的用法与许多人的理解不同,可能会导致混淆(例如,开发容器是否在我的机器上?)。

因此,我们已经更新了这些扩展中的命名和产品内命令,使其更加清晰,将它们重命名为WSLDev Containers。市场中的扩展标识符和文档中的链接保持不变,因此您在使用这两个扩展时不应看到任何中断。

市场中的WSL扩展

市场中的Dev Containers扩展

随着重命名,这些扩展的功能和修复工作也在继续。您可以在远程开发发布说明中了解更多信息。

开发容器功能

Dev Container 功能 让你可以轻松地将预打包的功能添加到你的开发容器中。无论是像 Git 或 Docker 这样的工具,还是对 Go 或 Java 等编程语言的支持,你都可以查看 可用功能 列表并将它们添加到你的 devcontainer.json 中。你还可以使用 功能模板 创建自己的功能,发布并与他人分享。

GitHub 拉取请求和问题

GitHub Pull Requests and Issues扩展方面取得了更多进展,该扩展允许您处理、创建和管理拉取请求和问题。此版本的亮点包括:

  • 改进了对GitHub Enterprise Server的支持。这包括:
    • 通过VS Code内置的GitHub Enterprise Server认证提供程序实现无PAT认证。
    • 当您打开包含企业仓库的文件夹时自动检测,并提供设置入口。
    • 修复了GitHub Enterprise Server的bug。
  • 用于将文件标记为已查看的复选框。

查看扩展的0.52.0版本更新日志以了解其他亮点。

GitHub 问题笔记本

工作区编辑

GitHub Issue Notebooks 扩展展示了笔记本API,并且非常实用。本着这种精神,我们采用了工作区编辑API的最新改进。现在有新的代码操作可以:

  • 将单元格移动/复制到新的笔记本中。
  • 允许您使用OR语句拆分单元格。
  • 使用片段编辑将符合条件的值如label:bug提取到变量中。
  • 基于代码片段的快速修复,用于值集错误。

将单元格移动到新笔记本中并快速修复值集违规

本地化

该扩展现在已完全本地化为VS Code支持的13种语言。它也是第一个使用新的本地化API进行本地化的扩展,这意味着本地化在桌面和网页上都能正常工作。

Jupyter

单元格标签和幻灯片编辑支持

我们现在可以直接在笔记本编辑器中编辑单元格标签和幻灯片类型,而无需打开文档的JSON格式。

这使我们能够为papermill参数化笔记本或为nbconvert自定义笔记本。

编辑Jupyter笔记本单元格标签

我们现在还可以通过命令直接更新笔记本单元格的幻灯片类型,将笔记本转换为用于演示的幻灯片。

编辑Jupyter笔记本幻灯片

上述两个示例都使用了notebook workspace edit API来编辑单元格元数据。如果您对如何支持编辑其他自定义单元格元数据感兴趣,可以从GitHub仓库中了解更多信息(cell-tags, slideshow)。

改进的交互窗口命令交互

interactive.input.focus 命令现在会将焦点赋予最近使用的交互窗口的输入框。在下面的短视频中,这些命令正在与自定义键盘快捷键一起使用。

使用键盘快捷键进行交互式窗口导航

Notebook 删除 单元格命令已为交互式窗口单元格启用,并且现在可以撤销。

Python 文件单元格折叠

Python 文件中用 # %% 标记的“单元格”现在可以在编辑器中折叠。

GitHub Enterprise Server 认证支持

在此之前,GitHub Enterprise Server 用户必须手动创建个人访问令牌(PAT)才能登录到 VS Code 中的 GitHub Enterprise Server(例如,与 GitHub Pull Requests and Issues 扩展一起使用)。这是一个繁琐的过程,要求用户离开 VS Code 创建 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文件中列出的必要包。我们希望这一新功能能简化环境创建过程,并鼓励用户利用环境来遵循最佳编码实践。

使用创建环境命令创建新的虚拟环境

扩展作者的新环境API

Python API 现在提供了一种方式,使扩展能够与用户在机器上可用的 Python 环境一起工作,这些环境由 Python 扩展发现。扩展还可以使用它来访问 Python 扩展用于运行脚本的所选环境路径,或将其更新为他们偏好的路径。

请随时在issue #18888中提供您的反馈。请注意,API尚未最终确定,因此可能会根据反馈进行更改,而不提供向后兼容性。

Python 扩展模板

Python 扩展模板 帮助您为您喜欢的 Python 工具(如 linters、格式化工具或代码分析实用程序)构建 Visual Studio Code 扩展。模板 为您提供了构建将您的工具集成到 VS Code 中的扩展所需的基本构建块。

预览功能

设置配置文件

我们在过去的几个月里一直在努力支持VS Code中的设置配置文件,这是社区中最受欢迎的需求之一。此功能可以通过workbench.experimental.settingsProfiles.enabled设置进行预览。尝试一下,并通过在vscode仓库中创建问题或在问题#116740中评论来给我们反馈。

设置配置文件指示器

VS Code 在活动栏的底部显示一个设置配置文件指示器。默认情况下,指示器中显示配置文件名称的前两个字符。您还可以将短名称自定义为任意两个字符、一个表情符号或一个 codicon。可以通过使用 $(codicon-id) 语法来引用 codicon。

设置配置文件指示器

当您点击此指示器时,会显示一个菜单,其中包含更改简称选项。

设置配置文件菜单

同步设置配置文件

VS Code 现在支持在您的 VS Code 实例之间同步设置配置文件。

注意: 此功能目前仅在 Insiders 版本的 VS Code 中可用。

WebAssembly 和 Python 在 Web 中的执行

在过去的几个月里,我们致力于将WebAssembly (WASM)引入VS Code。为了实现这一支持,我们主要做了两件事:

下面的截图显示运行一个Hello World程序:

在VS Code网页版中执行Python文件

你也可以使用命令Python WASM: Start REPL来启动一个Python REPL。

在VS Code网页版中运行的Python REPL

请注意,库和扩展都在开发中,并作为预览版提供。WebAssembly Python 解释器和 VS Code 本身都存在一些限制。解释器的主要限制包括:

  • 不支持pip。
  • 不支持套接字。
  • 不支持线程。因此,也没有异步支持。

然而,支持创建您自己的Python环境,包括源代码轮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"
}

请注意,当在远程位置调试扩展时(通过远程开发扩展的Dev Containers、SSH或WSL),使用--profile-temp标志将导致此状态消息:

断开连接状态栏消息

这是预期的,因为临时配置文件不包含任何扩展,这意味着远程开发扩展也缺失了。对于远程场景,建议您创建一个空的命名配置文件,将远程开发扩展添加到其中,然后使用--profile=....命令行选项。

改进的工作区编辑API

使用WorkspaceEdit编辑笔记本

工作区编辑现在可以使用vscode.NotebookEdit修改笔记本。vscode.NotebookEdit类包括用于创建插入、替换和删除笔记本中单元格的编辑的静态工厂函数:

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执行片段编辑。片段编辑类似于常规文本编辑,但它们允许用户通过占位符进行跳转、插入变量、从选择元素中选择等。了解更多关于片段的信息,请参阅本指南

请注意,片段编辑需要代码或笔记本编辑器,并且只能支持单个编辑器的片段编辑,否则它们的行为将类似于常规文本编辑。

我们相信,结合片段编辑和工作区编辑可以实现新的、更无缝的代码操作和重构,如下面来自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上下文菜单API使得高级webviews能够轻松自定义用户右键点击webview内部时显示的上下文菜单。这个新的贡献点使用VS Code的常规上下文菜单,因此自定义菜单与编辑器的其他部分完美契合。Webviews还可以为webview的不同部分显示自定义上下文菜单。

要在你的webview中添加一个新的上下文菜单项,首先在新的webview/context部分下的menus中添加一个新条目。每个贡献需要一个command(这也是项目标题的来源)和一个when子句。when子句应包含webviewId == 'YOUR_WEBVIEW_VIEW_TYPE',以确保上下文菜单仅适用于你的扩展的webviews:

"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 数据属性(或在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上下文菜单中的复制和粘贴条目。

如果用户在内右键点击,他们将看到:

在webview中显示的自定义上下文菜单

Webviews 中活动主题的新主题变量

新的 data-vscode-theme-id 数据属性在 webviews 中存储当前活动主题的 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 renderer API 现在更好地支持异步笔记本渲染器。虽然之前已经隐式支持,但现在 renderOutputItem 可以返回一个 Promise 来表示输出项正在渲染。现在 renderOutputItem 函数还会传递一个 AbortSignal,如果渲染被取消,该信号将被中止。

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

如果您的渲染器执行任何异步工作,请采用这些API更新,以便VS Code可以更好地支持您的渲染器。

重构.移动代码操作类型

新的refactor.move代码操作类型可用于重构代码(例如将符号移动到新文件或在文件中重新排序代码)。

虽然扩展以前可以创建refactor.move类型的代码操作,但现在这种类型已被正式记录,并且新的代码操作控件支持

传递给视图/标题操作的选定树项

贡献给view/title菜单的命令将接收两个参数:第一个是聚焦的树节点,第二个是树中所有选中的项目。

树视图初始大小贡献已确定

package.json中贡献视图的扩展可以使用initialSize属性来设置其视图的初始大小。initialSize的工作方式类似于CSS的flex-grow

在应用initialSize时有一些限制:

  • 这只是一个初始大小。一旦视图被渲染,initialSize将不再应用。
  • 仅当扩展拥有视图和视图容器时才应用。

树视图徽章已定稿

TreeView 有一个可选的 viewBadge 属性,可用于在视图的视图容器上设置数字徽章。

在活动栏中的视图上查看徽章

未绑定断点警告图标

调试扩展现在可以在存在未绑定断点的活动调试会话时定义提示消息。它将出现在断点视图的标题中,并且在悬停编辑器中的灰色断点图标时也会显示。以下是在js-debug扩展中使用它的示例:

悬停在断点警告图标上

此消息可以在调试器贡献中的新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 renderers现在公开了一个实验性API,允许扩展自定义JavaScript内容的渲染。此API目前公开了一个钩子preEvaluate,它在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 上注册一个渲染钩子:

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允许您向树项目添加复选框。

带有复选框的树项

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

本地化作为API的一部分

在这个迭代中,我们引入了一个新的API来帮助扩展本地化字符串。这取代了之前用于本地化的vscode-nlsvscode-nls-dev模块。这些模块将继续工作,但不会再获得任何新功能。新的API和工具设计得既熟悉又更易于使用和更灵活。此外,将其作为VS Code API的一部分使我们能够为桌面版VS Code和Web版VS Code的扩展本地化提供支持。

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 文件,然后我们将其提供给微软的翻译人员。翻译人员随后将翻译后的 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.contentsvscode.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类似于dezh-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日志消息相同的格式表示。

日志输出通道

工程

迈向“跨源隔离”

我们已经进行了更改,以便为VS Code桌面版和vscode.dev启用跨源隔离。这将启用新的强大功能,如共享数组缓冲区。VS Code本身以及扩展和webview都将从中受益。

跨源隔离目前处于功能标志之后,启用它可能会对从互联网加载资源的扩展和网页视图产生不良影响。您可以在为什么需要“跨源隔离”以获得强大功能中了解更多信息。我们希望尽早听到您的反馈。

尝试这个:

  • 使用--enable-coi标志运行VS Code桌面版,例如 code --enable-coi`。
  • 运行 vscode.dev 并附加 vscode-coi 查询。

要检查是否启用了跨源隔离,请使用开发者工具的应用程序选项卡或检查crossOriginIsolated全局变量的值。

为网页启用的跨源隔离

启动性能改进

我们在这个里程碑中预留了工程时间,以改善从启动VS Code到在文本编辑器中看到闪烁光标所需的启动时间。我们始终跟踪我们的性能数据,并注意到在上一个里程碑结束时性能略有下降,我们希望解决这个问题。

这是一个团队的努力,每个人都在整个源代码中贡献了各种更改。这里提到了一些亮点。

不再有同步文件系统调用

我们通常避免使用Node.js fs API的同步版本,因为我们知道这些方法会阻止脚本执行,直到文件系统请求得到解决。然而,在某些情况下,我们仍然依赖同步的fs执行,特别是在启动时打开或恢复窗口时。我们能够将这些调用更改为它们的异步版本,从而允许其他脚本在等待文件系统请求返回时继续运行。

更多主要入口点的捆绑

构成VS Code应用程序的主要捆绑包大小为数兆字节,使用vscode-loader打包为单个文件,并使用esbuild进行压缩。然而,在某些情况下,我们没有进行捆绑,特别是针对:

  • 我们在Electron主进程中的Node.js入口点,总是首先被调用。
  • 我们在Electron渲染器进程中用于打开窗口的bootstrap JavaScript文件。

在这两个领域进行捆绑使我们能够将启动时查找JavaScript文件的成本减少到仅对Electron主进程进行一次调用和对窗口本身进行一次调用。

将代码推送到后期阶段

最佳的性能修复方法是移除代码并永不运行它,但这显然不是一个可扩展的解决方案。另一种方法是将代码的执行延迟到后续阶段,例如在文本编辑器打开之后。在这个里程碑中,我们再次审查了我们的各个组件,并将其中一些推迟到后续阶段,以避免阻塞关键的启动路径。

文档内部工具

为了分析性能,我们大量使用浏览器的开发者工具和操作系统检查工具。然而,我们也有一些内置在VS Code中的工具。我们在VS Code开发的性能工具中记录了这些自定义工具,以便更多人能够从中受益。

更快的PR检查

对于拉取请求,我们运行自动的单元测试、集成测试和冒烟测试。所有这些步骤都是并行进行的,但每个步骤都需要将我们的TypeScript源代码转换为JavaScript代码。最初,我们使用TypeScript编译器来完成这个任务。它生成JavaScript代码,同时也进行类型检查。后者非常耗时,对于测试来说并不是必需的。由于测试被延迟,总体时间成本大约为5分钟。然后我们切换到了一个使用TypeScript编译器API的自定义仅转换解决方案。这要快得多,但仍然需要大约2分钟。

在这个里程碑中,我们转向了SWC(快速Web编译器),它甚至更快。现在,编译我们所有的TypeScript源代码大约需要12秒。这是一个巨大的改进,使我们能够更快地获得关于拉取请求的反馈。

显著的修复

  • 27799 macOS: 操作系统服务无法从编辑器中获取选中的文本
  • 60821 改进了“最近打开”与“入门”页面最近列表之间的同步。
  • 156777 当保持进程资源管理器打开时,每分钟5MB的内存泄漏
  • 159862 在macOS Catalina上,当处于全屏模式时,交通灯按钮显示错位
  • 161305 查看其他窗口设置时,“窗口:标题栏样式”链接不起作用

感谢您

最后但同样重要的是,向VS Code的贡献者们表示衷心的感谢

问题跟踪

对我们问题跟踪的贡献:

拉取请求

vscode 的贡献:

vscode-css-languageservice 的贡献:

vscode-pull-request-github 的贡献:

debug-adapter-protocol的贡献: