讲师中心 微信公众号

工具推荐

视频效率加速
剧云
剧云

中文短剧剧本制作平台

AniShort
AniShort

AI短剧协同制作平台

Laper
Laper

剧本策划到成片协作

updream

一键生成高质量推广成片

你可能不知道的10个VS Code隐藏技巧

老磊同学_4343

老磊同学_4343

发布时间:2025-11-28 17:42:05

|

752人浏览过

|

来源于php中文网

原创

VS Code 的强大在于提升效率的隐藏技巧:关闭预览模式使标签页常驻,禁用紧凑文件夹恢复目录层级,利用多光标与列选择实现批量编辑,通过命令面板快速执行操作,配置工作区统一项目设置,自动化任务减少重复,自定义代码片段加速常用结构输入,善用 Emmet 缩写高效编写 HTML/CSS。

你可能不知道的10个vs code隐藏技巧

VS Code 的强大之处不仅在于其基础功能,更在于那些能让你事半功倍的隐藏技巧。掌握这些方法,可以显著提升你的编辑效率和开发体验。

让文件标签页常驻不被替换

默认情况下,点击新文件会用预览模式打开,替换掉旧的标签页,双击才能固定。这在频繁切换文件时非常不便。解决方法是关闭预览模式:进入设置(Ctrl + ,),搜索 Workbench.editor.enablePreview,取消勾选该项。同时确保 Workbench > Editor: Show Tabs 是开启的,这样所有打开的文件都会以独立标签页的形式稳定显示。

禁用紧凑文件夹以恢复清晰目录结构

当一个文件夹下只有一个子文件夹时,VS Code 会默认将它们并列显示,这打乱了原有的层级关系,不利于文件拖拽操作。要恢复正常的嵌套视图,只需在设置中搜索 compact folders,然后取消勾选 Workbench > Tree: Compact Folders。修改后,目录树会立即恢复正常,单个子文件夹将正确地显示在其父文件夹之下。

使用高级选择与多光标进行批量编辑

VS Code 的多光标功能是处理重复性任务的利器。

  • 列(框)选择:按住 Alt 键并拖动鼠标,可以创建一个垂直的矩形选区。这对于在多行代码前统一添加文本(如注释或变量前缀)、对齐参数列表等场景极其高效。
  • 为每个匹配项添加光标:先选中一段文本,然后按下 Ctrl + Shift + L,编辑器会在当前文档中所有与所选内容相同的实例处都添加一个光标,实现真正的全局同步编辑。
  • 快速复制行:将光标置于目标行,使用 Shift + Alt + ↑/↓ 可以在上方或下方快速复制整行,比传统的复制粘贴快得多。

利用命令面板快速执行任何操作

快捷键记不住?没关系。Ctrl + Shift + P 打开的命令面板是 VS Code 的“瑞士军刀”。在这里,你可以通过输入关键词来搜索并执行几乎任何功能,无论是内置命令还是已安装扩展提供的功能。它还会显示对应操作的快捷键,是学习和发现新功能的最佳途径。

cn-json-diff
cn-json-diff

比较两个 JSON 文件并显示差异。支持嵌套结构、数组及值变更。纯 Python 标准库实现,无需 API 密钥。

下载

配置工作区以管理复杂项目

对于包含多个独立模块的大型项目,可以使用“工作区”功能。通过 文件 > 将文件夹添加到工作区,可以将前端、后端等多个文件夹整合在一个窗口中管理。更重要的是,可以在工作区根目录创建 .vscode/settings.json 文件,为整个项目组定义统一的设置(如缩进、格式化规则),确保团队协作的一致性,而不会影响其他项目的全局设置。

自动化任务以减少重复操作

VS Code 的 Tasks 功能可以将常见的命令行操作自动化。例如,可以配置一个任务,在保存文件时自动运行 ESLint 进行代码检查,或在提交代码前自动执行单元测试。通过编辑 .vscode/tasks.json 文件,你可以定义构建、部署等一系列流程,一键触发,无需手动输入冗长的命令。

自定义代码片段以加速编码

对于经常编写的代码结构(如 React 组件、日志语句或特定函数模板),可以创建自己的代码片段(Snippets)。进入 文件 > 首选项 > 用户代码片段,选择语言或创建全局片段。例如,定义一个前缀为 "clg" 的片段,其内容为 console.log('$1');,之后在 JavaScript 文件中输入 "clg" 并回车,就能自动生成 console.log 语句,并将光标定位在括号内。

善用 Emmet 加速 HTML/CSS 编写

Emmet 是 VS Code 内置的强大工具,尤其适用于前端开发。它允许你使用类似 CSS 选择器的缩写来快速生成 HTML 结构。例如,输入 div.container>ul.list>li.item*3 然后按 Tab 键,就能瞬间生成一个包含三个列表项的完整 HTML 片段,极大地提升了编写静态页面的效率。

基本上就这些。

热门AI工具

更多
二狗PPT
二狗PPT Hot

一款AI演示文稿工具,主要用于专为中式职场打造的AI PPT生成工具,适合需要提升相关任务效率的用户。

超级简历WonderCV

一款AI办公效率工具,主要用于免费求职简历模版下载制作,应届生职场人必备简历制作神器,适合需要提升相关任务效率的用户。

Loomy
Loomy Hot

一款AI工具,主要用于科大讯飞发布的桌面级 AI 助理,比 OpenClaw 更易用、更安全!,适合需要提升相关任务效率的用户。

Seko
Seko Hot

一款AI视频创作工具,主要用于商汤科技推出的创编一体的AI短视频创作Agent,适合需要提升相关任务效率的用户。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

码上飞
码上飞 Hot

一款基于自然语言的AI应用开发平台,可根据用户描述自动生成应用程序,帮助个人和团队快速完成应用原型与开发。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

音述AI
音述AI Hot

一款AI音频处理工具,主要用于音述AI是一个以“用声音述说故事”为核心的 AI 音乐创作与声音分享社区,适合需要提升相关任务效率的用户。

相关专题

更多
json数据格式
json数据格式

JSON是一种轻量级的数据交换格式。本专题为大家带来json数据格式相关文章,帮助大家解决问题。

2295

2023.08.07

json是什么
json是什么

JSON是一种轻量级的数据交换格式,具有简洁、易读、跨平台和语言的特点,JSON数据是通过键值对的方式进行组织,其中键是字符串,值可以是字符串、数值、布尔值、数组、对象或者null,在Web开发、数据交换和配置文件等方面得到广泛应用。本专题为大家提供json相关的文章、下载、课程内容,供大家免费下载体验。

3742

2023.08.23

jquery怎么操作json
jquery怎么操作json

操作的方法有:1、“$.parseJSON(jsonString)”2、“$.getJSON(url, data, success)”;3、“$.each(obj, callback)”;4、“$.ajax()”。更多jquery怎么操作json的详细内容,可以访问本专题下面的文章。

1236

2023.10.13

go语言处理json数据方法
go语言处理json数据方法

本专题整合了go语言中处理json数据方法,阅读专题下面的文章了解更多详细内容。

4339

2025.09.10

console接口是干嘛的
console接口是干嘛的

console接口是一种用于在计算机命令行或浏览器开发工具中输出信息的工具,提供了一种简单的方式来记录和查看应用程序的输出结果和调试信息。本专题为大家提供console接口相关的各种文章、以及下载和课程。

936

2023.08.08

console.log是什么
console.log是什么

console.log 是 javascript 函数,用于在浏览器控制台中输出信息,便于调试和故障排除。想了解更多console.log的相关内容,可以阅读本专题下面的文章。

6983

2024.05.29

vscode是什么_vscode怎么安装配置
vscode是什么_vscode怎么安装配置

VS Code(Visual Studio Code)是一款免费、开源的跨平台代码编辑器,由微软开发和维护。它被广泛用于软件开发和编程,支持多种编程语言和框架。VS Code 同时提供了丰富的功能和扩展性,使开发者可以高效地编写、编辑和调试代码。

1595

2023.06.30

vscode怎么运行代码
vscode怎么运行代码

vscode是一个运行于MacOS X、Windows和Linux之上的,针对于编写现代Web和云应用的跨平台源代码编辑器;vscode免费而且功能强大,对JavaScript和NodeJS的支持非常好,自带很多功能,例如代码格式化,代码智能提示补全、Emmet插件等。php中文网给大家带来了相关的教程以及文章,欢迎大家前来阅读学习。

3432

2023.07.21

Postman身份认证怎么配置
Postman身份认证怎么配置

本专题从实际API接口调试场景出发,讲解Postman身份认证的完整配置流程,包括常见认证协议介绍、授权参数设置、访问令牌填写、OAuth 2.0授权及认证失败排查,帮助用户正确完成接口授权与访问验证。

40

2026.11.06

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Visual Studio 扩展开发指南
Visual Studio 扩展开发指南

共0课时 | 0人学习

Visual Studio 入门指南
Visual Studio 入门指南

共0课时 | 0人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn