10种途径，让你在Visual StudioCode中轻松高效编码！

最新推荐文章于 2024-03-28 13:00:05 发布

「已注销」

最新推荐文章于 2024-03-28 13:00:05 发布

阅读量904

点赞数

本文链接：https://blog.csdn.net/duxinshuxiaobian/article/details/103650516

版权

全文共4309字，预计学习时长13分钟

图源：ke.xue63.com

进入工作状态后，开发人员的大脑通常在以每小时100英里的速度运行。高速输入代码，并努力记录下自己的想法，以免它们消失在其他思想的虚无或深渊中。这个时候代码编辑器的作用显得至关重要，好的编辑器可以发挥自身的功能，让你编码更轻松。

VisualStudio Code自问世以来，已成为代码编辑器中的后起之秀。作为一个功能强大且轻巧的免费软件，它具有强大的扩展社区，是微软最好的产品之一。

今天，小芯就为各位带来，在VisualStudio Code中帮助提高编码速度的10种途径以及它们是如何帮助开发人员加速编码进程的。

1. 快捷键绑定

每次手指离开键盘，都会给整个代码编写过程增加几秒钟的时间花费。尽管看起来只是几秒钟，但改变手的位置并切换到完全不同的任务可能就足以打破整个工作流程状态。

许多开发人员倾向于使用键盘来开展所有事情——仅仅是因为这样更快。

通过快捷键绑定，开发人员可以直接通过键盘执行大多数任务，这意味着不必花太多时间对不同的菜单和文件进行搜索，就可以实现想要的目标。

这些按键绑定本质上都是键盘快捷键，可以通过ctrl + k + s查看列表。

快捷键绑定面板的外观，图源：VS Code

或者，如果不想学习一组全新的键盘快捷键或创建自己的快捷键，可以自行选择创建自定义键绑定。此外，还可以从其他流行的编辑器导入按键绑定。这样就可以不必学习一套全新的键盘快捷键。

开发人员可以在此链接找到用于重置（还原默认）VisualStudio Code快捷方式的扩展。

2. 代码格式化程序与技术债务追踪器

格式化代码可能会很麻烦。当然，linters可以完成这项工作，但大多数情况下，开发人员必须单独运行它们。

使用代码格式化程序是一种通过将所有内容格式化为相同的格式，来加快开发过程并确保代码具有一定程度一致性的方法。这非常方便，特别是对于基于团队的项目，每个人都可能有自己的格式化风格。

代码格式化程序通常基于特定的编码规范，并确保在涉及间距、括号位置和代码显示方式时，每个程序都在同一页上。

虽然代码格式化程序可能有助于减少基于团队的参数并使代码看起来更可观，但它并不能从本质上消除技术债务，这也是即将推出技术债务追踪扩展程序的原因。

预览代码中技术债务追踪器的外形，图源：Tech Debt Tracker

技术债务追踪器使用一系列通用指标来确定代码的复杂性和潜在的债务。此扩展专门针对JavaScript和TypeScript代码——通过提供有关如何改进的即时反馈，可以帮助开发人员养成编写清晰易读的代码的习惯。

3. Git服务器

开发人员可以直接用Visual Studio Code编辑器自带的git行使提交权限。事实证明，git是受支持的，开发人员可以在命令行执行stage语句、提交、回滚、注释和其他所有操作，但这些都得在代码编辑器中进行。

开发人员所要做的就是点击加号进行添加，并右键单击特定的文件来访问更多的选项。

虽然从技术上讲，开发者可以通过控制台或GitHub的桌面应用程序来完成这些操作，但无需离开编辑器即可提交和更改将有助于加快整个流程。

这是因为处在编辑器中，可以以一种高效的方式对编码进行更改，而无需中断工作流来找出问题所在。

4. 集成终端

拥有集成终端可以节省开发人员在多个屏幕之间切换的时间。这也意味着他们可以在自动编译期间轻松发现错误，而无需中断工作流程。

打开终端的快捷键是ctrl + 反引号 `。

打开终端时，它最初将从当前工作区的根目录开始工作。

如要打开另一个终端，则使用快捷键ctrl + 反引号`+shift。

终端的外观示例图

5. 实时共享

以前和别人一起编辑过Google文档吗？除了代码不同，实时共享（Live share）本质上与Google文档共享是同一个概念（除去通过Azure或GitHub帐户连接的情况）。

实时共享就像编写代码的Google文档一样，非常有助于开展团队协作。它可以更快地调试问题，并且支持结对编程和快速编程。

实时共享不是自带功能，但通过此链接可以将其下载为扩展程序。

6. 代码片段

Snippets（代码片段）是一个重要的生产力提升工具，因为它废除了编码的手工作业。也许乍看起来，这像是在作弊，而一旦在Angular视图中多次输入switch语句，开发人员就能克服这种心理障碍。

编码主要是教会开发人员选择模式以及在哪种情况下使用何种模式。代码片段能够加速编码工作流，因为预先配置的代码位唾手可得。

因此，开发人员需要花更多的时间考虑代码之间的适配与协调，而非纠结于代码本身的实际意义。这听起来确实很奇怪，但如果项目时间有限，花在思考结构和架构上的精力越多，交付可靠和可拓展成果的可能性就越大。

使用快捷代码段还可以帮助开发人员更快地学习特定的框架或知识库，因为他们花费了更少的时间去找出问题所在，从而可以把更多地精力放在争取一次性解决问题上。

John Papa撰写的Angular TypeScript Snippets forVS Code是帮助编写更快Angular代码的优秀指南。dsznajder撰写的ES7React/Redux/GraphQL/React-Native snippets能够作为快捷代码段用于React项目。

笔者还没有使用过Vue组件，但是hollowtree的Vue2 Snippets插件已有了90万以上的安装量，这似乎是一个很有潜力的Vue代码片段扩展。

或者，可以直接导航到上面突出显示的图标A，直接从VS Code中下载扩展程序。

7. 调试器

Visual Studio Code带有调试器，该调试器可以运行代码并将断点放置在开发人员希望代码停止的位置。这样一来，开发人员可以在特定时间点暂停代码运行并观察具体情况。

调试不仅仅是通过检查Chrome开发者的控制台来解决问题。也许开发者已经找到了问题发生的位置，并对特定的行、函数或方法产生了怀疑。

在特定点停止代码运行的功能意味着开发者可以在代码运行时修改并解决问题，同时检查本地状态、调用状态和相关内容。

调试图标，图源：VS Code

所要做的就是通过左侧的bug图标定位到调试器，然后单击play按钮启动应用程序。

还可以转到控制台，在命令行中键入当前状态以便进行观察。

默认情况下，Visual Studio Code基于Node.js来运行调试器，但也可以在Chrome本身上运行调试器。在正常情况下，开发人员无法暂停应用程序的运行状态。但是通过使用调试器，他们可以创建断点并查看发生了什么。

在此过程中，开发人员还可以突出显示代码以查看事物在任何特定断点处的当前状态。

安装GitLens扩展程序，它将为开发人员提供更多关于提交 (commits) 的信息，比如谁做了什么、远程存储库、标签以及缓存及未缓存的变更。它还可以利用来自git的信息，比如提交时间、所做的更改、编写内容的人和提交ID等，来注释代码。只要把鼠标悬停在一段代码上，就能够让开发人员获得这些详细内容。这种方式在团队环境中非常有效，并使问责制高度透明。

8. 智能感知

智能感知（IntelliSense）是自动完成（auto-complete）的进阶词汇，它比通常意义上的“自动完成”要灵活得多。

智能感知被吹捧为Visual Studio Code的核心生产力功能之一，而许多使用该编辑器的人并没有充分利用此功能。

当开发人员将鼠标悬停在代码中的某一部分上时，智能感知将提供额外的详细输入信息，以便追踪源代码的来源。虽然这些信息在处理其他人创建的陌生对象时很有用，但智能感知的主要功能在于预测开发人员的下一步行动。