news 2026/10/21 1:17:06

Visual Studio Code 用户界面(User Interface)完全指南:六大区域布局、编辑器分组与工作台定制

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
Visual Studio Code 用户界面(User Interface)完全指南:六大区域布局、编辑器分组与工作台定制
  • 文档
  • 教程

【免费下载链接】vscode-docs

Public documentation for Visual Studio Code

项目地址:https://gitcode.com/gh_mirrors/vs/vscode-docs
点击查看免费下载

本指南以 Visual Studio Code(VS Code)官方用户界面文档为骨架,系统讲解工作台(Workbench)的六大核心区域、编辑器分组与并排编辑、标签页(Tabs)体系、Explorer 视图、迷你地图(Minimap)、Sticky Scroll、面包屑(Breadcrumbs)、命令面板(Command Palette)以及 Zen Mode、窗口管理等定制能力。读完本文,你将能够熟练驾驭 VS Code 的默认布局,并通过设置项与键盘快捷键把工作台调整成最适合自己工作流的样子。

基本布局:工作台的六大区域

VS Code 本质是一个代码编辑器,与其他主流编辑器一样,它采用"左侧资源管理器 + 右侧编辑器"的通用布局:左侧的 Explorer 展示你所能访问的全部文件与文件夹,右侧的编辑器区域展示你打开的文件内容。在此基础上,用户界面被划分为六个主要区域:

区域位置与作用
编辑器(Editor)编辑文件的主要区域,可以横向、纵向并排打开任意数量的编辑器
主侧边栏(Primary Side Bar)包含 Explorer 等视图,辅助你完成项目操作
次侧边栏(Secondary Side Bar)位于主侧边栏对侧,默认承载 Copilot Chat 视图;可将主侧边栏中的视图拖拽到次侧边栏
状态栏(Status Bar)展示打开项目与当前编辑文件的相关信息
活动栏(Activity Bar)位于最左侧,用于切换视图,并提供上下文相关指示(如启用 Git 时显示待推送更改数);右键可打开上下文菜单调整位置
面板(Panel)位于编辑器区域下方的附加空间,默认包含输出、调试信息、错误与警告以及集成终端;也可移动到左侧或右侧以腾出更多纵向空间

每次启动 VS Code,它都会恢复到上次关闭时的状态:文件夹、布局和打开的文件都会被保留。各编辑器中打开的文件以标签页(Tabs)形式显示在编辑器区域顶部,详见后文 标签页 一节。

提示:右键单击活动栏并选择Move Primary Side Bar Right,即可把主侧边栏移到右侧;也可使用kbstyle(workbench.action.toggleSidebarVisibility)快捷键切换其可见性。关于主/次侧边栏的更多细节,参见仓库中的 自定义布局指南。

并排编辑(Side by Side Editing)

你可以横向或纵向并排打开任意数量的编辑器。在已有一个编辑器打开时,有多种方式在旁边打开第二个编辑器:

  • 按住Alt键并在 Explorer 视图中单击文件;
  • 使用kbstyle(workbench.action.splitEditor)将当前编辑器一分为二;
  • 在 Explorer 右键菜单中选择Open to the Side(kbstyle(explorer.openToSide));
  • 单击编辑器右上角的Split Editor(拆分编辑器)按钮;
  • 把文件拖拽到编辑器区域的任意一侧;按住Ctrl(macOS 为Option)拖拽则复制标签而不是移动;
  • 在Quick Open(kbstyle(workbench.action.quickOpen))文件列表中按kbstyle(explorer.openToSide)。

当打开另一个文件时,内容会显示在当前处于激活状态的编辑器中。如果两个编辑器并排,想把foo.cs打开到右侧编辑器,请先单击右侧编辑器使其激活,再打开该文件。

默认情况下,新编辑器打开在活动编辑器的右侧。可通过workbench.editor.openSideBySideDirection设置改为打开在活动编辑器下方。

拥有多个编辑器时,按住Ctrl(macOS 为Cmd)并按1、2、3可快速切换。

提示:编辑器支持调整大小与重排,直接拖拽编辑器标题区即可重新定位或调整大小。

编辑器组(Editor Groups)

使用Split Editor或Open to the Side拆分编辑器时,会创建一个新的编辑器区域(编辑器组),该组可容纳多个项目。你可以纵向、横向并排打开任意数量的编辑器组。

在 Explorer 视图顶部的Open Editors区域(通过 Explorer 的...菜单开启)可以清楚地看到这些编辑器组:

你可以在工作台上拖放编辑器组、在组间移动单个标签、或快速关闭整个组(Close All)。

注意:无论是否启用标签页,VS Code 都会使用编辑器组。禁用标签页时,编辑器组表现为一组堆叠的打开项,编辑器窗格只显示最近选中的一项。

组内拆分(Split in Group)

使用View: Split Editor in Group命令(kbstyle(workbench.action.splitEditorInGroup))可以在不创建新编辑器组的情况下拆分当前编辑器。关于该编辑器模式及两侧导航的专用命令,参见仓库中的 自定义布局-组内拆分 一节。

浮动窗口(Floating Windows)

编辑器、终端或特定视图可以移入独立的浮动窗口,适合多显示器场景下把某个文件单独放到另一块屏幕上显示。

把编辑器标签拖出当前窗口即可打开为浮动窗口;也可以在编辑器标签的右键菜单中选择Move into New Window或Copy into New Window。浮动窗口标题栏上的Set Always on Top(置顶,图钉图标)选项可将其固定到屏幕最上层。更多细节参见仓库中的 自定义布局-浮动窗口 一节。

模态编辑器(Modal Editors)

某些配置型编辑器会以居中模态浮层的形式覆盖在编辑器区域上方,而不是作为普通标签页打开,包括:

  • Settings(设置)编辑器
  • Keyboard Shortcuts(键盘快捷键)编辑器
  • Profiles(配置文件)编辑器
  • Workspace Trust(工作区信任)编辑器
  • Language Models(语言模型)编辑器
  • Extensions(扩展)编辑器

单击浮层外部、按Escape或选择关闭按钮即可关闭模态编辑器;也可以将其最大化填满编辑器区域,或移回主窗口作为普通标签页。

注意:workbench.editor.useModal设置控制该行为:off表示始终以普通标签页打开;some表示仅配置型编辑器以模态浮层打开(默认值);all表示所有编辑器都以模态浮层打开。

迷你地图(Minimap)

迷你地图(代码大纲)提供源码的高层概览,便于快速导航与理解代码。文件迷你地图显示在编辑器右侧,可以单击或拖拽其中的阴影区域快速跳转到文件的不同位置。

如果编辑器中存在 折叠标记(如//#region注释),迷你地图会显示折叠标记名称。折叠标记与语言相关,请确认你的语言支持哪些标记。

提示:在用户或工作区 设置 中设置"editor.minimap.side": "left"可将迷你地图移到左侧,设置"editor.minimap.enabled": false可完全禁用。

Sticky Scroll(粘性滚动)

Sticky Scroll 会在编辑器顶部固定显示当前可见嵌套作用域的起始行,帮助你随时了解自己在文件中的位置,并快速跳回当前作用域顶部。

提示:可用editor.stickyScroll.enabled设置启用或禁用 Sticky Scroll。

Sticky Scroll 使用多种内容模型来生成标题,可在大纲提供者模型(outline provider)、**折叠提供者模型(folding provider)与缩进模型(indentation)**之间选择,以决定 Sticky Scroll 区域显示哪些行。若当前语言不提供某模型,VS Code 会按上述顺序回退到下一个模型。初始使用的默认模型由editor.stickyScroll.defaultModel设置决定。

缩进参考线(Indent Guides)

编辑器会显示缩进参考线(垂直线),帮助快速对齐匹配的缩进层级。如需禁用,可在用户或工作区 设置 中将editor.guides.indentation设为false。

面包屑导航(Breadcrumbs)

编辑器顶部有一条导航栏,即面包屑。面包屑始终显示文件路径;如果当前文件类型具备语言符号支持,还会显示光标位置所在的符号路径。借助面包屑可以在文件夹、文件与符号之间快速导航。

可通过View>Appearance>Toggle Breadcrumbs菜单项或View: Toggle Breadcrumbs命令禁用面包屑。关于外观定制(如breadcrumbs.filePath、breadcrumbs.symbolPath、breadcrumbs.symbolSortOrder等)的更多说明,参见仓库中 代码导航文章的面包屑章节。

Explorer 视图

Explorer 视图用于浏览、打开和管理项目中的文件与文件夹。VS Code 以文件和文件夹为基本单元,打开文件或文件夹即可立即开始工作。打开文件夹后,其内容会显示在 Explorer 视图中,你可以在此执行:

  • 创建、删除、重命名文件和文件夹;
  • 通过拖放移动文件和文件夹;
  • 使用右键上下文菜单探索全部选项。

提示:可从 VS Code 外部把文件拖入 Explorer 视图进行复制;若 Explorer 为空则会改为打开这些文件。也可以从外部复制粘贴文件到 Explorer。explorer.autoOpenDroppedFile设置控制拖入后是否自动打开该文件。

VS Code 与命令行工具配合良好。若想在当前打开的文件夹上下文中运行命令行工具,右键该文件夹并选择Open in Integrated Terminal。如需在操作系统原生文件管理器中定位文件,右键选择Reveal in File Explorer(Windows)、Reveal in Finder(macOS)或Open Containing Folder(Linux)。

提示:按kbstyle(workbench.action.quickOpen)(Quick Open)可以快速按名称搜索并打开文件。

默认情况下,VS Code 会在 Explorer 中排除部分文件夹(如.git)。可用files.exclude设置配置隐藏规则,其 glob 模式遵循操作系统的大小写规则(Windows/macOS 不区分大小写,Linux 区分大小写),详见仓库中的 glob 模式文档。

还可通过启用explorer.excludeGitIgnore设置,让.gitignore中列出的文件与文件夹一并隐藏。启用后,.gitignore模式在 Windows/macOS 上不区分大小写匹配,Linux 上区分大小写。例如.gitignore中的node_modules在 Windows/macOS 上会匹配node_modules/、Node_Modules/、NODE_MODULES/等各种大小写变体,在 Linux 上则只精确匹配。

启用imageCarousel.explorerContextMenu.enabled(实验性)后,可在 Explorer 中右键图片/视频文件或文件夹并选择Open Images in Carousel,以轮播视图浏览媒体文件,也支持多选。

提示:可以隐藏派生资源文件,例如 Unity 的*.meta或 TypeScript 项目生成的*.js。排除 Unity 的*.cs.meta可配置"**/*.cs.meta": true;排除 TypeScript 编译生成的 JS 可配置"**/*.js": {"when": "$(basename).ts"}。

多选(Multi-selection)

在 Explorer 视图和 Open Editors 区域可以多选文件,对多个项目批量执行操作(删除、拖放、打开到侧边)。按住Ctrl(macOS 为Cmd)逐个选择,或按住Shift选择连续范围。选中两项后,还可使用右键菜单的Compare Selected命令快速对比两个文件的差异。

注意:早期版本中,按住Ctrl(macOS 为Cmd)单击文件会在侧边新建编辑器组打开。若希望恢复该行为,可通过workbench.list.multiSelectModifier设置改用Alt键进行多选:

"workbench.list.multiSelectModifier": "alt"

高级树导航(Advanced Tree Navigation)

可以过滤 Explorer 视图中的文件与文件夹。聚焦 Explorer 视图后,按kbstyle(list.find)打开查找控件并输入要匹配的文件/文件夹名称片段。该导航功能适用于 VS Code 中所有树视图。

Filter按钮在两种模式间切换:高亮与过滤。按Down可聚焦第一个匹配元素并逐个导航后续匹配项;高亮模式下,文件夹会显示徽标以提示其包含匹配文件。Fuzzy Match按钮则在精确匹配与模糊匹配之间切换,模糊匹配下输入一串字符即可匹配文件名/文件夹名的任意部分。

大纲视图(Outline View)

大纲视图是 Explorer 视图底部的独立区域,展开后显示当前激活编辑器的符号树。

大纲视图提供不同的Sort By排序模式、可选的游标跟踪、常规打开手势,以及用于查找/过滤的输入框。错误与警告也会显示在大纲视图中,让你一眼看到问题所在位置。

符号信息由已安装的扩展针对不同文件类型计算。例如,内置 Markdown 支持会返回 Markdown 文件的标题层级作为符号。

可通过 设置 配置大纲视图,搜索以outline.开头的设置项即可调整其显示内容。

时间线视图(Timeline View)

时间线视图位于文件资源管理器底部,是一个统一的可视化文件事件历史的视图,例如可以按时间线查看 Git 提交或本地文件保存记录。

时间线工具栏中的过滤操作可在源控制事件与本地文件事件之间切换:

本地文件历史(Local File History)

根据设置,每次保存编辑器时都会在列表中添加新条目。每个本地历史条目包含创建时文件的完整内容,某些情况下还能提供更多语义信息(例如标记一次重构)。针对某个条目,你可以:

  • 与本地文件或上一个条目对比更改;
  • 恢复内容;
  • 删除或重命名该条目。

提示:如果不慎删除了文件,可在时间线视图中使用...>Local History: Find Entry to Restore操作,再从 Quick Pick 中选择文件进行恢复。

本地历史的相关设置:

  • workbench.localHistory.enabled:启用或禁用本地历史(默认true)
  • workbench.localHistory.maxFileSize:创建本地历史条目的文件大小上限(默认 256 KB)
  • workbench.localHistory.maxFileEntries:每个文件的本地历史条目上限(默认 50)
  • workbench.localHistory.exclude:将某些文件排除在本地历史之外的 glob 模式
  • workbench.localHistory.mergeWindow:后续更改并入上一条本地历史记录的间隔秒数(默认 10 秒)
提交历史(Commit History)

VS Code 内置的 Git 支持提供指定文件的 Git 提交历史。选择某个提交会打开该提交引入更改的差异视图;右键单击提交可获得Copy Commit ID和Copy Commit Message选项。右键历史中的提交时,还可:

  • Open Changes:打开文件更改的差异视图;
  • View Commit:打开多文件差异视图,查看提交中所有文件的更改;
  • Select for Compare:选择条目与另一条目对比;
  • Copy Commit ID:复制提交 ID 到剪贴板;
  • Copy Commit Message:复制提交消息到剪贴板。

Git 历史相关设置:

  • git.timeline.date:显示文件提交的提交日期(committed date)或作者日期(authored date)

视图(Views)

Explorer 只是 VS Code 提供的视图之一,此外还有:

  • Search(搜索):在打开的文件夹内进行全局搜索与替换;
  • Source Control(源代码管理):VS Code 默认内置 Git 源代码管理;
  • Run(运行):运行与调试视图,显示变量、调用栈和断点;
  • Extensions(扩展):在 VS Code 内安装和管理扩展;
  • 自定义视图:由扩展贡献的视图。

提示:可使用View: Open View命令打开任意视图。

右键活动栏可以显示或隐藏视图,通过拖放可调整视图顺序。在 Explorer 视图内部,可通过...菜单显示/隐藏分区,或拖放分区进行重排。

命令面板(Command Palette)

VS Code 同样强调键盘可达性。最重要的快捷键是kbstyle(workbench.action.showCommands),它呼出命令面板。在这里可以访问 VS Code 的全部功能,包括最常见操作的键盘快捷键。

命令面板提供大量命令:可以运行编辑器命令、打开文件、搜索符号、查看文件快速大纲,全部在同一交互窗口中完成。几个实用技巧:

  • kbstyle(workbench.action.quickOpen):输入名称即可跳转到任意文件或符号;
  • kbstyle(workbench.action.quickOpenPreviousRecentlyUsedEditorInGroup):在最近打开的文件集之间循环切换;
  • kbstyle(workbench.action.showCommands):直接进入编辑器命令列表;
  • kbstyle(workbench.action.gotoSymbol):跳转到文件中的特定符号;
  • kbstyle(workbench.action.gotoLine):跳转到文件中的特定行。

在输入框中输入?可查看可从命令面板运行的全部命令列表。

提示:可用鼠标抓住命令面板顶部边缘将其拖到其他位置;也可在标题栏选择Customize Layout控件,再选择某个预置的Quick Input Positions。

配置编辑器

VS Code 提供大量编辑器配置选项。通过View>Appearance菜单,可以隐藏或切换界面各部分,如Side Bar、Status Bar和Activity Bar。

隐藏菜单栏(Windows、Linux)

在 Windows 和 Linux 上,可将window.menuBarVisibility从classic改为toggle或hidden来隐藏菜单栏。toggle模式下按一次Alt键即可重新显示菜单栏。

也可以使用View: Toggle Menu Bar命令隐藏菜单栏:该命令将window.menuBarVisibility从classic切换为compact,菜单栏会并入活动栏。再次运行View: Toggle Menu Bar可恢复classic位置。

设置(Settings)

大多数编辑器配置通过设置管理,可直接修改。设置既可作为用户设置全局生效,也可作为工作区设置按项目/文件夹生效。设置值存储在settings.json文件 中。

在设置编辑器中查看与编辑设置(File>Preferences>Settings,或按kbstyle(workbench.action.openSettings)),用User与Workspace选项卡切换用户/工作区设置,顶部搜索框可过滤设置项。

也可以直接编辑settings.json:使用Preferences: Open User Settings (JSON)命令打开用户settings.json;工作区设置则编辑工作区.vscode文件夹中的settings.json。

注意:工作区设置会覆盖用户设置,适合在团队间共享项目特定配置。

Zen Mode(禅模式)

Zen Mode 通过隐藏除编辑器外的所有 UI 元素、切换到全屏并居中编辑器,让你专注于代码。可通过View>Appearance>Zen Mode菜单、命令面板中的View: Toggle Zen Mode或快捷键kbstyle(workbench.action.toggleZenMode)切换。连按两次Esc退出 Zen Mode。可通过zenMode.fullScreen设置禁用全屏过渡。

Zen Mode 相关设置:

  • zenMode.hideActivityBar:隐藏活动栏。默认true
  • zenMode.hideStatusBar:隐藏状态栏。默认true
  • zenMode.hideLineNumbers:隐藏行号。默认true
  • zenMode.showTabs:控制显示多个、单个还是不显示编辑器标签。默认multiple
  • zenMode.fullScreen:全屏显示工作台。默认true
  • zenMode.restore:重启时恢复 Zen Mode。默认true
  • zenMode.centerLayout:使用 居中编辑器布局。默认true
  • zenMode.silentNotifications:不显示通知。默认true

用勿扰模式(Do Not Disturb Mode)减少通知

如果被不断弹出的通知打扰,可以降低通知数量——无论是全部通知,还是来自特定扩展的通知。

单击状态栏中的铃铛图标(若通知定位在右上角,则位于标题栏)打开通知区域。这里可以随时访问所有通知,即使启用了勿扰模式。通知位置可通过workbench.notifications.position设置调整,更多参见仓库中的 自定义布局-通知位置。

找到带斜线的铃铛图标可打开菜单,选择性禁用来自扩展的通知,或启用全局勿扰模式以禁用所有通知。

注意:全局勿扰模式也会隐藏错误通知;而针对扩展的过滤仍会显示错误通知。

居中编辑器布局(Centered Editor Layout)

居中编辑器布局将编辑器区域居中显示,适合在大显示器上使用单个编辑器。可通过两侧边框调整视图宽度(按住Alt键可独立移动两侧)。

标签页(Tabs)

VS Code 用标签页(标签式标题)在编辑器上方区域展示打开项。打开文件时,会为该文件新增一个标签页,方便你在各项目之间快速切换。

可拖放标签进行重排。要对多个标签批量操作,按住Ctrl(macOS 为Cmd)选择目标标签;按住Shift可选中连续范围内的标签。

当打开项超过标题区可容纳的数量时,可通过 Explorer 视图中的Open Editors区域(通过...按钮访问)显示标签项下拉列表。

标签区与编辑器区之间还有一条滚动条,用于把编辑器拖入视野。设置Workbench > Editor: Title Scrollbar Sizing(workbench.editor.titleScrollbarSizing)为large可加高滚动条便于拖拽;workbench.editor.titleScrollbarVisibility设置控制滚动条可见性。

如果不想使用标签页,可将workbench.editor.showTabs设为single禁用该功能:

"workbench.editor.showTabs": "single"

相关优化参见下文 无标签页工作 一节。

提示:双击编辑器标题区可快速新建标签页。

标签排序(Tab Ordering)

默认情况下,新标签页添加到现有标签的右侧。可通过workbench.editor.openPositioning设置控制新标签的出现位置。例如,让新标签出现在左侧:

"workbench.editor.openPositioning": "left"

标签可通过拖放重排。若希望某个编辑器标签始终可见,可将其固定(pin)到标签栏,参见仓库中的 自定义布局-固定标签。

workbench.editor.showTabIndex设置可在标签标题中显示每个标签的序号,方便与Ctrl(macOS 为Cmd)+ 数字快捷键配合快速切换到指定标签。

预览模式(Preview Mode)

在 Explorer 视图中单击文件时,文件以预览模式打开并复用现有标签(预览标签)。这适合快速浏览文件,避免每个访问过的文件都独占一个标签。当你开始编辑该文件,或在 Explorer 中双击打开文件时,才会为该文件单独创建标签。

预览模式在标签标题中以斜体显示:

如果不想使用预览模式、始终创建新标签,可用以下设置控制:

  • workbench.editor.enablePreview:全局启用或禁用预览编辑器;
  • workbench.editor.enablePreviewFromQuickOpen:启用或禁用从Quick Open打开时的预览编辑器。

换行标签(Wrapped Tabs)

为了显示更多编辑器标签,可使用换行标签布局,让标签在编辑器区域上方换行填充多行。通过Workbench > Editor: Wrap Tabs(workbench.editor.wrapTabs)设置启用:

自定义标签标签名(Customize Tab Labels)

当多个同名文件同时打开时,标签难以区分。为此可以给标签应用自定义显示标签,并可选择工作区中哪些文件应用。

启用workbench.editor.customLabels.enabled设置:

"workbench.editor.customLabels.enabled": true

再通过workbench.editor.customLabels.patterns设置指定一个或多个命名模式。命名模式由两部分组成:

  • Item:一个 glob 模式,匹配要应用自定义标签的文件路径。例如**/static/**/*.html。
  • Value:自定义标签的模板,可使用${filename}、${extname}、${extname(N)}、${dirname}、${dirname(N)}等变量,它们会被文件路径中的实际值动态替换。

下面的示例把/src/orders/index.html显示为orders/index:

"workbench.editor.customLabels.patterns": { "**/src/**/index.html": "${dirname}/${filename}" }

以下示例以文件tests/editor.test.ts演示${extname}变量的取值:

  • ${filename}=> editor
  • ${extname}=> test.ts
  • ${extname(0)}=> ts
  • ${extname(1)}=> test
  • ${extname(-1)}=> test
  • ${extname(-2)}=> ts

注意:自定义标签同样作用于 Open Editors 视图和 Quick Open(kbstyle(workbench.action.quickOpen))。

网格编辑器布局(Grid Editor Layout)

默认情况下编辑器组以垂直列布局。例如拆分编辑器时,新编辑器打开在侧边。你可以把编辑器组排成任意布局,纵向横向均可。

为支持灵活布局,你可以创建空的编辑器组。默认关闭编辑器组最后一个编辑器时,该组也会随之关闭,但可通过workbench.editor.closeEmptyGroups: false改变此行为。

View>Editor Layout菜单提供一组预定义的编辑器布局:

默认情况下,侧边打开的编辑器(如通过编辑器工具栏Split Editor操作)打开在活动编辑器右侧。若希望打开在下方,可将workbench.editor.openSideBySideDirection设为down。

提示:按住Alt键悬停在拆分编辑器的工具栏操作上时,会提供另一种方向的拆分。这是快速拆分到右侧或底部的捷径。

键盘快捷键

以下快捷键便于在编辑器与编辑器组之间快速导航:

  • kbstyle(workbench.action.nextEditor):转到右侧编辑器
  • kbstyle(workbench.action.previousEditor):转到左侧编辑器
  • kbstyle(workbench.action.quickOpenPreviousRecentlyUsedEditorInGroup):打开编辑器组最近使用列表中的上一个编辑器
  • kbstyle(workbench.action.focusFirstEditorGroup):转到最左侧编辑器组
  • kbstyle(workbench.action.focusSecondEditorGroup):转到中间编辑器组
  • kbstyle(workbench.action.focusThirdEditorGroup):转到最右侧编辑器组
  • kbstyle(workbench.action.closeActiveEditor):关闭活动编辑器
  • kbstyle(workbench.action.closeEditorsInGroup):关闭编辑器组中的所有编辑器
  • kbstyle(workbench.action.closeAllEditors):关闭所有编辑器

如需修改默认键盘快捷键,参见仓库中的 键绑定(Key Bindings) 一文。

无标签页工作(Working Without Tabs)

如果不想使用标签页(标签式标题),可将workbench.editor.showTabs设为single或none完全禁用。

禁用预览模式

无标签页时,Explorer 视图的Open Editors区域是快速进行文件导航的方式。但启用 预览编辑器模式 时,文件不会加入 Open Editors 区域。可通过workbench.editor.enablePreview与workbench.editor.enablePreviewFromQuickOpen设置禁用。

用键盘快捷键浏览编辑器历史

可将Ctrl+Tab改为显示所有已打开编辑器的历史列表(与活动编辑器组无关)。编辑你的 键盘快捷键 并添加以下内容:

{ "key": "ctrl+tab", "command": "workbench.action.openPreviousEditorFromHistory" }, { "key": "ctrl+tab", "command": "workbench.action.quickOpenNavigateNext", "when": "inQuickOpen" },

关闭整个组而非单个编辑器

如果你喜欢 VS Code 关闭单个编辑器时同时关闭整个组的行为,可在 键绑定 中绑定以下内容。

macOS:

{ "key": "cmd+w", "command": "workbench.action.closeEditorsInGroup" }

Windows/Linux:

{ "key": "ctrl+w", "command": "workbench.action.closeEditorsInGroup" }

窗口管理(Window Management)

VS Code 提供多种选项,控制窗口(实例)如何在会话之间打开或恢复。

window.openFoldersInNewWindow与window.openFilesInNewWindow设置用于配置为文件或文件夹打开新窗口或复用最后一个活动窗口,可选值为default、on和off。

配置为default时,VS Code 会根据打开请求的上下文决定复用还是打开新窗口。设为on或off则始终如一地执行该行为。例如,若希望从File菜单选择文件或文件夹时总是打开新窗口,可设为on。

注意:某些情况下该设置会被忽略,例如使用-new-window或-reuse-window命令行选项时。

window.restoreWindows设置告知 VS Code 如何恢复上一会话打开的窗口。默认(all)恢复上一会话中处理过的所有窗口;设为none则永不重新打开窗口,始终以空实例启动;设为one只恢复最后处理的窗口;设为folders只恢复打开过文件夹的窗口。

常见问题(Common Questions)

如何更改缩进参考线的颜色?

缩进参考线颜色可以自定义,就像大多数 VS Code 用户界面元素一样。要在当前颜色主题下自定义缩进参考线颜色,可参考 主题色参考,使用workbench.colorCustomizations设置并修改editorIndentGuide.background值。

例如,将缩进参考线改为亮蓝色,可在settings.json中添加:

"workbench.colorCustomizations": { "editorIndentGuide.background": "#0000ff" }

能否隐藏 Explorer 视图中的 Open Editors 区域?

可以。在 Explorer 的 Views 菜单中切换Open Editors菜单项即可显示或隐藏该区域。

下一步

现在你已经了解了 VS Code 的整体布局,可以开始按自己的工作习惯定制编辑器:

  • 更改主题:按偏好设置颜色主题和/或文件图标主题;
  • 使用自定义布局:深入了解 VS Code 工作台与编辑器布局的更多定制能力。
  • 文档
  • 教程

【免费下载链接】vscode-docs

Public documentation for Visual Studio Code

项目地址:https://gitcode.com/gh_mirrors/vs/vscode-docs
点击查看免费下载

相关推荐

上一篇:3分钟看懂DETR注意力机制:让AI告诉你它"看到"了什么
下一篇:Auto_TS高级配置指南:掌握参数调优与模型定制化技巧

创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/10/21 1:17:06

HTML注释的底层原理、常见坑与工程化实践详解

直接聊点实际的——HTML注释&#xff0c;这个话题我做了十年前端也没敢说完全搞明白了。很多新手觉得注释不就是<!-- -->包一下吗&#xff1f;但我在真实项目里见过太多因为注释翻车的案例&#xff1a;有人一个注释嵌套把整页样式搞崩了&#xff0c;有人把内网接口地址写…

作者头像 李华
网站建设 2026/10/21 1:16:33

蓝桥杯交易账本题解:差分数组建模撤销与查询

2023 年蓝桥杯国赛的“交易账本”&#xff0c;赛后好几个人问我思路。这道题题面读起来绕&#xff0c;尤其那个“撤销操作”&#xff0c;一旦理解歪了&#xff0c;实现起来就是灾难。我自己第一版代码就吃过亏&#xff0c;当时把所有操作当成“时间轴上的一次性变化”来处理&am…

作者头像 李华
网站建设 2026/10/13 10:29:16

CSDN第一篇技术博客写作指南:选题、排版与搜索优化

第一次在CSDN上按下“发布文章”那个按钮时&#xff0c;心里其实挺没底的&#xff1a;“我的第一个CSDN - First (小白 求指点)”这个标题&#xff0c;几乎是每个技术写作者的缩影。我刚入行时也发过类似的文章——内容就几百字&#xff0c;讲一个命令行怎么敲&#xff0c;排版…

作者头像 李华
网站建设 2026/10/17 7:17:11

如何安全管理 OpenFlux 共享密钥:传输、存储与轮换实战指南

如何安全管理 OpenFlux 共享密钥&#xff1a;传输、存储与轮换实战指南 OpenFlux 是一款网络栈研究工具&#xff0c;通过可插拔的传输层构建 TCP 隧道。当启用传输加密时&#xff0c;客户端与出口节点共用的**共享密钥&#xff08;shared secret&#xff09;**就是整条隧道的安…

作者头像 李华