深入解析 Visual Studio Code:十大高效技巧
Visual Studio Code 毫无疑问是当前最受欢迎的编程文本编辑器之一。对许多开发者而言,它已超越 Sublime Text,成为首选的编码工具。这款基于 Electron 的 JavaScript 应用拥有极快的速度和卓越的性能,避免了许多同类 JavaScript 应用常见的性能瓶颈。
值得一提的是,VS Code 是完全开源的,其源代码在 GitHub 上公开。如果你想大幅提升你的工作效率和优化工作流程,那么深入了解并掌握以下这些 Visual Studio Code 的基本技巧将至关重要。
1. 精通 VS Code 的命令面板
与 Sublime Text(以及早期的 TextMate)类似,VS Code 提供了强大的命令面板功能。 通过命令面板,你可以通过简单的键入来快速访问各种指令,而无需使用鼠标在菜单中导航。
使用快捷键 Ctrl + Shift + P
(在 macOS 上是 Cmd + Shift + P
)即可唤出命令面板。只需开始输入你想要执行的操作,例如“关闭”,选项列表将实时更新。一些命令被归类到不同的类别中,例如“文件”、“Git”或“终端”,这使得它们更容易被找到。
2. 设置工作项目文件夹
点击导航侧栏中的“资源管理器”图标,将会展开一个子面板。该子面板通常包含两个部分(如果需要,你可能需要点击三点菜单,选择“打开编辑器”使其显示): “打开编辑器” (显示当前打开的文件) 和 “未打开文件夹”。 我们关注的是后者。
点击 “打开文件夹” (或者通过菜单栏选择“文件” > “打开文件夹”),然后选择你系统上的任意文件夹。 这将把选定的文件夹加载为 VS Code 中的“当前工作项目”,使你可以轻松访问其中的所有文件和子文件夹,避免频繁地切换到文件管理器。
3. 同时查看多个文件
大多数现代文本编辑器都支持同时处理多个文件,允许用户通过标签页在打开的文件之间切换。更高级的编辑器甚至支持并排编辑,VS Code 也提供了此功能(尽管仅限于水平并排)。
然而,在笔记本电脑或较小的显示器上进行并排编辑可能比较困难,而这正是 VS Code 的动态面板功能发挥作用的时候。
VS Code 的动态面板功能可以在打开的文档面板过窄时,在激活该文档(即,光标位于其中时)自动扩展宽度。如果你还在使用接近 720p 分辨率的显示器,你一定会喜欢这个功能。
4. 一次编辑多行
如果你需要在整个文档中插入或删除多个文本实例,可以通过创建多个光标来实现。 按住 Alt
键 (在 macOS 上是 Option
键),并在文本中任意位置点击,就可以创建一个新的光标。每次点击都会创建一个新的光标。
这个功能在处理 HTML 代码时尤其有用,比如当你需要添加同一类别的多个实例,或者需要更改多个超链接的格式时。 掌握这个技巧,你将会爱上它。
5. 跳转到定义
在编程或编写脚本时,经常会遇到你不熟悉的变量或方法。 你通常会怎么做? 花费时间搜索相关文件?或者,你可以用光标选择变量或方法,然后按下 F12 立即跳转到其定义。 另外一种方式是,选中你想要查看定义的方法、函数或变量,按住 Ctrl
键 (在 macOS 上是 Cmd
键),然后点击它以跳转到定义。
你还可以使用快捷键 Alt + F12
(或者在 macOS 上使用 Cmd + F12
) 来预览定义,它将会在光标所在的行中显示定义,而不是打开源文件。
如果你想反向操作,选择已定义的变量或方法,使用快捷键 Shift + F12
查找所有对它的引用。 结果也会显示在光标所在的行中。
为了确保这些功能有效,你需要将正确的文件夹设置为“当前工作项目”(见技巧#2)。
6. 重命名所有匹配项
重构代码是编写和维护清晰代码的必要环节,但这有时可能会让人感到头疼,尤其是在你重构一个大型模块或代码块的时候。 为了避免在数十个文件中搜索和修改变量名或方法名,VS Code 提供了便捷的重命名功能。
当你选择一个变量或方法,然后按下 F2,就可以编辑它的名字,VS Code 将会修改整个“当前工作项目”中所有该变量名称的实例。
如果你只想在当前文件中修改,你可以使用快捷键 Ctrl/Cmd + F2
,VS Code 将会在当前文件中该名称的所有实例处生成光标。
7. 搜索多个文件
如果你使用的文件不是源代码文件,上述的符号查找功能(在技巧#5中介绍)将不可用。那么,当你需要查找一段文本或一个单词,但你不知道它在哪个文件中时,你该怎么做? 你可以回到基本的“查找”功能。
Ctrl/Cmd + F
允许你在当前文件中搜索,而 Ctrl + Shift + F
(或者在 macOS 上使用 Shift + Cmd + F
)允许你在整个“当前工作项目”的所有文件中搜索,包括所有递归的子文件夹。
8. 在 VS Code 中使用命令行
VS Code 自带集成终端。在 Windows 上,它显示为命令提示符,而在 macOS 和 Linux 上,它显示为 Bash 提示符。无论哪种方式,终端都会在当前工作项目的目录(如果有的话)启动,否则在你的主目录中启动。
它还支持创建多个独立的终端实例。点击右上角的加号 (+) 按钮可以创建更多的终端实例,或者点击垃圾桶图标关闭当前的终端。下拉菜单可以轻松地在不同终端之间切换,并且不会像标签页界面那样占用过多的屏幕空间。
9. 在 VS Code 中安装新主题
你可能会认为 VS Code 允许你对文本和源代码的语法高亮进行自定义。 虽然它不允许对界面本身进行自定义,但是语法高亮却是至关重要的。 一个好的主题能够比你想象的更能提升你的工作效率。
你可以在 VS Code 市场 找到新主题(这些主题都是免费的),或者你也可以直接在 VS Code 中搜索它们。 如果你需要建议,可以参考其他用户评出的最佳 VS Code 主题列表。
10. 在 VS Code 中安装第三方扩展
最后需要强调的一个基本功能是 VS Code 通过第三方扩展实现的可扩展性。 与主题一样,你可以在 VS Code 市场 找到扩展(是的,它们也是免费的),或者你可以在 VS Code 中直接搜索它们。 使用快捷键 Ctrl + Shift + X
(在 macOS 上使用 Shift + Cmd + X
)可以访问“扩展”面板。
扩展是最大化工作效率的关键。 你可以在这里找到各种工具,比如代码检查器、调试器、代码片段、VS Code 本身的体验优化,构建工具,甚至是一些使用 ChatGPT 来简化 VS Code 编程的扩展。
Visual Studio Code 是最好的文本编辑器
虽然很多人对它赞赏有加,但 VS Code 并非适合所有人,没有完美的事物,它可能不是你想要的。 请记住,VS Code 是一个文本编辑器,而不是一个成熟的 IDE。
但是,你应该尝试一下,并以开放的心态体验它。 我们相信,它的功能可能会让你感到惊喜 – 而且是以积极的方式!