– 代理会话日,2月19日

终端外观

Visual Studio Code 的终端外观可以进行广泛的自定义。

An example of a custom UI, using Powerline and Nerd Font symbols in the prompt and a custom workbench theme

Sapphire 主题,使用字体 HackNerd Font 符号的自定义 Starship 提示符

文本样式

可以使用以下设置自定义终端中的文本

  • terminal.integrated.fontFamily
    • Open in VS Code
    • Open in VS Code Insiders
    :要使用的字体族,这需要与 CSS 中的 fontFamily 格式相同的字符串。例如,"'Fira Code', monospace" 将配置 Fira Code 作为首选字体,并配置 monospace 作为在缺少字形时的备用字体。
  • terminal.integrated.fontSize
    • Open in VS Code
    • Open in VS Code Insiders
    :更改终端中文本的字体大小。
  • terminal.integrated.letterSpacing
    • Open in VS Code
    • Open in VS Code Insiders
    :以像素为单位配置字符之间的额外水平间距。
  • terminal.integrated.lineHeight
    • Open in VS Code
    • Open in VS Code Insiders
    :将额外垂直间距配置为常规行高的倍数。例如,1.1 将添加 10% 的额外垂直空间。
  • terminal.integrated.fontWeight
    • Open in VS Code
    • Open in VS Code Insiders
    :配置“常规”文本的字体粗细。
  • terminal.integrated.fontWeightBold
    • Open in VS Code
    • Open in VS Code Insiders
    :配置“粗体”文本的字体粗细。
  • terminal.integrated.fontLigatures.*配置连字

Powerline 符号和 Nerd Fonts

Powerline 字体是特殊的已修补字体,其中包含可在终端中使用的其他字符。VS Code 的终端 无需配置字体即可渲染一些 Powerline 符号,但如果需要更多字形,请使用字体族设置配置 Powerline 字体。Powerline 字体通常以 " for Powerline" 结尾,以下设置是配置已修补的 DejaVu Sans Mono 的示例

"editor.fontFamily": "'DejaVu Sans Mono for Powerline'"

Nerd Fonts 的工作方式相同,通常具有 " NF" 后缀,以下是配置 Hack 的 nerd fonts 变体的示例

"terminal.integrated.fontFamily": "'Hack NF'"

终端光标

可以使用以下设置自定义终端光标样式和是否闪烁

  • terminal.integrated.cursorStyle
    • Open in VS Code
    • Open in VS Code Insiders
    :定义光标的形状,可以是块、行或下划线。
  • terminal.integrated.cursorWidth
    • Open in VS Code
    • Open in VS Code Insiders
    :当光标样式设置为 line 时,光标应为多少像素宽。
  • terminal.integrated.cursorBlinking
    • Open in VS Code
    • Open in VS Code Insiders
    :终端处于焦点状态时,光标是否应闪烁。
  • terminal.integrated.cursorStyleInactive
    • Open in VS Code
    • Open in VS Code Insiders
    :定义光标的形状,可以是轮廓、块、行、下划线或无。

自定义选项卡

默认情况下,终端选项卡出现在终端视图的右侧,当有两个或多个终端时,当只有一个终端时,在视图标题中显示活动终端。

A blank terminal without tabs and then with tabs displayed for three terminals

可见性

默认可见性旨在节省水平空间,但可能不是理想的。可以使用以下设置配置选项卡的呈现方式

  • terminal.integrated.tabs.hideCondition
    • Open in VS Code
    • Open in VS Code Insiders
    :何时隐藏右侧的选项卡,设置为 never 始终显示它们。
  • terminal.integrated.tabs.showActiveTerminal
    • Open in VS Code
    • Open in VS Code Insiders
    :何时在终端视图标题中显示活动终端。
  • terminal.integrated.tabs.showActions
    • 在 VS Code 中打开
    • 在 VS Code Insiders 中打开
    :何时在视图标题中显示活动终端的操作。
  • terminal.integrated.tabs.location
    • 在 VS Code 中打开
    • 在 VS Code Insiders 中打开
    :选项卡是否应显示在终端的左侧或右侧。
  • terminal.integrated.tabs.enabled
    • 在 VS Code 中打开
    • 在 VS Code Insiders 中打开
    :是否使用选项卡,禁用后将显示原始下拉视图。

选项卡文本

每个选项卡的文本由以下设置决定

  • terminal.integrated.tabs.title
    • 在 VS Code 中打开
    • 在 VS Code Insiders 中打开
    :选项卡标题。
  • terminal.integrated.tabs.description
    • 在 VS Code 中打开
    • 在 VS Code Insiders 中打开
    :出现在标题右侧的文本。
  • terminal.integrated.tabs.separator
    • 在 VS Code 中打开
    • 在 VS Code Insiders 中打开
    :标题和描述符之间的分隔符字符。

默认情况下,标题显示 shell 检测到的进程名称。

其他终端通常将 shell 发送的转义序列显示为标题,可以使用以下方式进行配置

"terminal.integrated.tabs.title": "${sequence}"

以下是可用于使用的所有变量

  • ${cwd}:终端的当前工作目录。
  • ${cwdFolder}:终端的当前工作目录,在多根工作区或在单个根工作区中显示,当值与初始工作目录不同时。在 Windows 上,只有在启用 shell 集成时才会显示此项。
  • ${workspaceFolder}:启动终端的工作区。
  • ${workspaceFolderName}:启动终端的工作区的名称。
  • ${local}:指示远程工作区中的本地终端。
  • ${process}:终端进程的名称。
  • ${progress}:由 OSC 9;4 序列报告的进度状态。
  • ${separator}:一个条件分隔符 (-) ,仅在它被具有值或静态文本的变量包围时才显示。
  • ${sequence}:进程提供给终端的名称。
  • ${task}:指示此终端与任务关联。
  • ${shellType}:检测到的 shell 类型。
  • ${shellCommand}:根据 shell 集成执行的命令。这还需要对检测到的命令行有很高的信心,这在某些提示框架中可能无法工作。
  • ${shellPromptInput}:根据 shell 集成,shell 的完整提示输入。

图标

每个终端都与一个相关的图标相关联,该图标由其 终端配置文件 决定。默认图标及其颜色(如果未在配置文件中定义),可以使用 进行配置

terminal.integrated.tabs.defaultIcon
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
terminal.integrated.tabs.defaultColor
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
设置。

状态

终端的“状态”(如果有)由出现在选项卡右侧的图标表示。某些状态涉及动画。如果这令人分心,可以使用以下方式禁用动画

"terminal.integrated.tabs.enableAnimation": false

视觉铃声

当终端的铃声被触发时,会短暂显示一个黄色铃铛图标。可以使用 禁用此功能

terminal.integrated.enableBell
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
并且可以使用
terminal.integrated.bellDuration
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
配置持续时间。

终端颜色

虽然终端能够显示真彩色,但程序通常使用 8 个 ANSI 颜色(黑色、红色、绿色、黄色、蓝色、品红色、青色和白色)以及每种颜色的明亮变体。这些 ANSI 颜色由活动 颜色主题 决定,但也可以使用 workbench.colorCustomizations 设置从主题独立配置。

是否使用普通 ANSI 颜色或明亮变体来显示粗体文本可以使用 配置

terminal.integrated.drawBoldTextInBrightColors
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
设置来指定 VS Code 应该查找技能的自定义路径。

最小对比度

终端通常由于与深色/浅色主题、ANSI 颜色或运行的 shell/程序等冲突而存在对比度问题,等等。

最小对比度比率功能通过增加或减少文本前景色亮度来解决此问题,直到达到 4.5:1 的对比度比率。

缺点是彩色文本有时可能会失去一些饱和度。可以使用以下方式配置或禁用此功能以获得原始颜色

"terminal.integrated.minimumContrastRatio": 1

连字

终端 连字 允许将多个字符渲染为一个。如果终端字体系列 (

terminal.integrated.fontFamily
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
) 支持它们,则可以通过配置 启用连字

terminal.integrated.fontLigatures.enabled
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
设置。

Enabling ligatures will combine certain sets of characters into one, for example >= into the greater than or equals sign

字体功能设置

启用连字后,还可以以 font-feature-settings CSS 属性的格式设置详细的字体功能设置列表。这使您可以更精细地控制连字的渲染方式。例如,禁用标准的 calt 连字并启用特定的字体变体看起来像 "calt" off, "ss03"。有关字体支持的变体的列表,请查阅字体文档。

回退连字

当字体支持连字但 VS Code 不支持解析该字体时,您可以禁用 GPU 加速 或指定要手动连接以创建连字的字符序列列表。

默认情况下,回退连字是编码中常用的连字列表。通过配置 调整列表

terminal.integrated.fontLigatures.fallbackLigatures
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
设置。例如

// Only use ligatures for `ff`, `fi` and `fl`
"terminal.integrated.fontLigatures.fallbackLigatures": [
    "ff",
    "fi",
    "fl"
]

GPU 加速

终端具有两种不同的渲染器,每种渲染器都有不同的权衡

  • WebGL 渲染器 - 真正的 GPU 加速。
  • DOM 渲染器 - 一种备用渲染器,速度较慢,但具有很强的兼容性。

默认情况下,终端启用由 WebGL 渲染器驱动的 GPU 加速。这有助于终端更快地工作,并通过显著减少 CPU 花费在每帧渲染上的时间来以高 FPS 显示内容。

默认

terminal.integrated.gpuAcceleration
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
值 `auto` 会尝试 WebGL 渲染器,如果失败则回退到 DOM 渲染器。在 Linux 虚拟机、不支持 WebGL 的浏览器或驱动程序过时的机器上,WebGL 可能无法正常工作。

自定义字形

GPU 加速 启用时,自定义渲染(而不是字体)可以改善终端中某些字符的显示方式。支持以下 Unicode 范围:

  • 框绘制 (U+2500-U+257F)
  • 块元素 (U+2580-U+259F)
  • 盲文模式 (U+2800-U+28FF)
  • Powerline 符号 (U+E0A0-U+E0D4,私有使用区)
  • 进度指示器 (U+EE00-U+EE0B,私有使用区)
  • Git 分支符号 (U+F5D0-U+F60D,私有使用区)
  • 用于传统计算的符号 (U+1FB00-U+1FBFF)

这也意味着配置的字体不需要包含这些字符,并且它们将像素完美地绘制,并在适当的情况下拉伸到整个单元格的大小。

以下是上述范围内的所有约 800 个受支持字符

Box drawing, block characters and some Powerline symbols fill the entire cell in the terminal

可以通过设置

terminal.integrated.customGlyphs
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
设置为 false 来禁用组织指令。

重新缩放模糊宽度字形

某些 Unicode 字符具有模糊的宽度,终端的后端和前端可能对其大小不一致。当 GPU 加速 启用并且出现这种歧义时,字形将水平重新缩放以适应单个单元格并防止重叠。

例如,下图显示了被压缩到单个单元格的罗马数字字符

VIII and XII characters would be rescaled horizontally so as to not overlap with following characters. They feature a thinner stroke width when this happens due to the scaling

可以通过设置

terminal.integrated.rescaleOverlappingGlyphs
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
设置为 false,这将导致以下重叠渲染

When off, the VIII and XII characters may overlap the following characters

自定义提示符

大多数 shell 允许对终端提示进行广泛的自定义。这通过在 VS Code 外部配置 shell 来完成,通常是通过修改 $PS1 变量、设置 $PROMPT_COMMAND 或安装插件来完成。

Starshipoh-my-posh 这样的某些提示显示了 git 状态等内容,并且适用于大多数 shell,因此在开始使用时它们是一个不错的选择。

常见问题

为什么我的终端显示多色三角形或黑色矩形?

终端在某些环境中可能存在 GPU 加速渲染问题。例如,您可能会看到一个大而多色的三角形而不是文本。这通常是由驱动程序/VM 图形问题引起的,并且在 Chromium 中也会发生同样的情况。通过使用 --disable-gpu 标志启动 code 或通过设置

terminal.integrated.gpuAcceleration
  • 在 VS Code 中打开
  • 在 VS Code Insiders 中打开
off 来避免在终端中使用画布,从而解决这些问题。有关更多信息,请参阅 GPU 加速 部分。

为什么终端中的颜色不正确?

最小对比度比例功能可能导致颜色显示不正确。可以使用以下方式禁用它:

"terminal.integrated.minimumContrastRatio": 1

有关为什么这是默认设置的背景信息,请参见 vscode#146406

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