我如何使用 Visual Studio Code 提高我的生产力 为什么这很重要 我的生产力技巧 结论

2025-05-25

我如何使用 Visual Studio Code 提高工作效率

为什么这很重要

我的效率秘诀

结论

在这篇文章中,我将描述如何通过学习更有效地使用Visual Studio Code来提高工作效率。

但总的来说,请始终考虑这个建议,因为它确实很重要:

了解你的 IDE/编辑器,以便能够以最有效的方式使用它

为什么这很重要

回顾我职业软件开发生涯初期,作为一名程序员的经历,我肯定会给自己同样的建议。在我刚开始从事开发的日子里,我的大部分代码交互都是用鼠标完成的,并没有优化我的 IDE 或文本编辑器。

今天我认为我可以更有效地浏览我的代码,因此有更多的时间做更重要的事情。

我的效率秘诀

了解最重要的键盘快捷键

在我看来,这是作为一名开发人员可以采取的最重要的一步。花点时间学习你一天中最常用的快捷键。

这里是我最常用的一些OS X 快捷方式

如果您是 Windows 或 Linux 用户,请检查相应的快捷方式:Windows 快捷方式
Linux 快捷方式

  • CMD + P:打开命令面板,您可以搜索任何文件。例如:输入cdcts进行搜索,customer-details.component.ts在我看来,这是跳转到特定文件的最快方法。您绝对应该改用这种方法,而不是用鼠标在资源管理器中导航。快速打开
  • CMD + D:查找并选择当前选定单词的下一个匹配项。多光标词
  • CMD + arrow down/up:将光标移动到当前文件的末尾/开头
  • CMD + arrow right/left:将光标移动到当前行的末尾/开头
  • Option + arrow right/left:按单词移动光标
  • Option + Shift + arrow right/left:按单词进行选择
  • Option + arrow up/down:向上或向下移动当前行
  • Option + Shift + arrow up/down:将当前行复制到上一行或下一行
  • CMD + Shift + K:删除当前行
  • CMD + B:切换侧边栏可见性
  • CMD + Shift + F:跨文件搜索
  • CMD + .:提供快速修复。例如,我主要用它来根据给定的 linting 规则自动重新排列导入的代码。
  • CMD + Option + arrow left/right
  • 多光标:多光标对于编辑多行代码非常有帮助。多光标

有关更多基本快捷方式和详细信息,请参阅基本编辑。

命令面板

CMD + Shift + P可以打开命令面板,它是 Visual Studio Code 中的一个强大工具。

只需输入任何要执行的命令,即可找到它(如果可用)。此外,您还可以在命令旁边看到相应的快捷键。这也是一种优雅的方式来开始学习最常用命令的键盘快捷键。

命令面板

埃米特

我必须承认,当我意识到 VS Code 默认支持 Emmet 以及它如此强大的功能时,我感到非常震惊。Emmet 是一款标记扩展工具,可以大大简化 HTML 的编写。它易于学习,语法也非常简单。查看Emmet 速查表,了解更多关于 Emmet 语法的信息。

这里你可以看到 Emmet 的实际效果:

使用工作区

我最近开始使用VS Code 中的多根工作区。当你同时处理多个相关项目时,它们会非常有用。例如,我为所有私人项目创建了一个工作区。

使用工作区,我不必处理多个 VS Code 编辑器窗口,而始终使用包含我当前工作区的一个窗口。

使用插件

以下是我最常用的一些 VS Code 插件:

我这里没有提到的是所有特定于框架的插件。因此,我当然建议你安装适用于你所使用的框架/技术/编程语言的插件。它们也能为你节省大量时间。

结论

这些只是我能提供的一些提高效率的小技巧。当然,VS Code 还提供了许多其他功能,可以帮助您处理各种事务(请参阅下面的链接)。例如,VS Code 每月都会发布一个重大更新,其中包含许多新功能和改进。请阅读这些版本的发行说明,因为它们通常包含可以进一步提高您工作效率的新功能。

另外,请花点时间学习你的 IDE/编辑器(如果你还没有学习的话)。这绝对会让你成为一名更优秀的程序员。

链接

文章来源:https://dev.to/mokkaapps/how-i-increased-my-productivity-with-visual-studio-code-gfo
PREV
我为什么从 Visual Studio Code 切换到 JetBrains WebStorm
NEXT
调试 React 为何(重新)渲染组件