更快——无需鼠标即可进行 VSCode 导航

2025-05-28

更快——无需鼠标即可进行 VSCode 导航

动机

VSCode 是一款专为鼠标操作体验而调校的 GUI 编辑器,为什么还要在意无鼠标体验呢?答案就是速度。
如果您能以更快的速度完成日常任务,就能节省时间,让您更长时间地保持“流畅”操作。不妨先了解一下 VSCode 的常用默认按键绑定,了解哪些功能可用以及哪些功能已经可用:MAC / Windows

然而,真正的价值主张并非试图记住几十个键盘快捷键,而是优化日常工作流程中“最常用的路径”。你希望在日常工作中尽可能减少摩擦,这意味着在大多数导航和代码编辑中避免使用鼠标/触控板。让我们深入探讨一下。

VSCode 在面板、文件和工具提示之间导航

(1)活动栏

VSCode 活动栏
根据扩展程序和设置的数量,您的活动栏可能与我的有所不同。活动栏中的所有菜单都可以通过键盘访问,但我们无需费力记住您可能每月只使用一次的那个不起眼的扩展程序。让我们重点介绍最重要的几个:

  • 文件资源管理器CMD+SHIFT+E- 我们经常使用它,在文件之间导航并浏览项目文件树结构。VSCode 在文件资源管理器中的默认行为有一个令人烦恼的地方:当你高亮显示文件并点击ENTER它时,默认会重命名文件。如果你想打开它(我几乎 100% 都是这样),你必须使用CMD+Down_Arrow。这很奇特,但值得记住。

  • 项目搜索CMD+SHIFT+F- 非常实用,可帮助您在项目中查找任何内容。打开项目,输入搜索字符串“hit” ENTER,即可开始搜索。如果您想直接跳转到结果页面,无需鼠标,CMD+Down_Arrow只需点击“hit”,即可浏览结果中的文件。

  • 源代码控制CTRL+SHIFT+G。我通常只是用键盘启动这个面板,但后来切换到用鼠标交互,因为我喜欢点击文件,查看更改并直接在面板中提交它们。我发现鼠标更有用,但如果你愿意,你也可以用键盘做所有事情。

好的,现在我们已经掌握了这些,您永远不需要离开键盘来启动文件资源管理器或在项目中进行搜索!

(2)在代码、活动栏和终端之间导航

VSCode 的这三个部分绝对是任何人工作流程中最常用、最重要的部分。我经常在活动栏之间跳转,编辑代码,然后转到终端重启服务器或执行其他操作。为了执行一个快捷命令而不停地用鼠标在这些面板之间切换,真是令人沮丧。

  • 聚焦左侧面板(可以是活动栏选择中的任何内容)CMD+0
  • 聚焦中间面板(打开文件)CMD+1从技术上讲,这会聚焦您打开的第一个文件,如果您在拆分中打开了另一个文件,则可以执行此操作CMD+2并直接跳转到您打开的第二个文件。
  • 显示终端CMD+JCTRL+`。请注意,这仅显示终端。如果我们已经打开终端并希望将其聚焦,VSCode 似乎没有为此类操作提供默认的按键绑定。我们可以自己定义。打开命令面板CMD+SHIFT+P,输入“键盘”,然后选择 JSON 格式为“打开键盘快捷键 (JSON)”的快捷键,现在我们可以为任何操作添加任意按键绑定。我的设置如下:```

{ "key": "ctrl+l", "command": "workbench.action.terminal.focus" },
{ "key": "ctrl+l", "command": "workbench.action.focusActiveEditorGroup", "when": "terminalFocus" },

You can change that "key" string to whatever feels good, but the objective here is with these two settings you can cycle through editor focus and terminal focus with one keybinding. That is super nice!

**(3) Navigating within a file super fast**
Once you have a file that is opened it is tempting to reach for a mouse and start scrolling up and down the file to find the relevant spot in code or just to gauge the shape of the file. Here are a few key techniques to get you around any file with more efficiency:
  * `CMD+Up_Arrow/Down_Arrow` Jump to the beginning/end of the file. This is very useful when you need to quickly jump to the import section of the file or the export section which is usually at the end.
  * `CMD+SHIFT+O` Navigate between **symbols** within a file. This is the most useful command that nobody uses! It gives you a quick panel to cycle through function definitions/methods defined within a file.
![navigation](https://dev-to-uploads.s3.amazonaws.com/i/e7k17pvybh9f814u90cb.gif)
  * `CMD+F` Find in File. Very powerful and useful command. We all know how to use it but you can actually use this one to quickly jump to a certain section in the file. Say you have function called `adder` you hit `CMD+F` type `add` and with a quick ESC your cursor is already there, ready to edit. Handy!

---
That is it folks! General advice learning these keybindings is to start small, start wherever your "hottest path" is and try and optimize that a little to be more comfortable and faster. Don't try and do too much, memorize all the things, you will struggle to remember it all.

In Part2 of this series, we will be talking about fast code editing!
Let me know below your favorite shortcut and other tips and tricks you discovered.
Enter fullscreen mode Exit fullscreen mode
文章来源:https://dev.to/vaidotas/get-faster-vscode-navigation-without-a-mouse-3d0m
PREV
关于 HTTP cookie 的实用完整教程
NEXT
2019 年面向开发者的 10 个播客