使用 CodeLens 的扩展

Name: Visual Studio Code
Author: Microsoft

2017 年 2 月 12 日 Wade Anderson, @waderyan_

CodeLens 是 Visual Studio Code 中的一个常用功能。该功能的精髓在于将“可操作的上下文信息穿插”在您的源代码中。这听起来有些拗口。让我来为您详细解释一下。

CodeLens 是您代码中的链接

可操作性 - 您可以点击链接，然后会发生一些事情。
上下文相关性 - 链接位于它们所代表的代码附近。
穿插性 - 链接分布在您的源代码中。

animation showing CodeLens

VS Code 为 TypeScript 提供了 CodeLens。您可以在用户设置中通过 "typescript.referencesCodeLens.enabled": true 来启用它。

CodeLens in TypeScript

您可以使用 CodeLens 功能创建自己的扩展。首先查阅文档开始。此外，您可以在市场中找到一些使用了 CodeLens 的热门扩展。这篇博客文章列出了一些我喜欢的。

提示： 通过安装 CodeLens Roundup 扩展包，您可以一次性安装所有这些扩展。如何将扩展捆绑在一起？请查阅扩展包。

Git Lens

市场 - Git Lens

作者 - eamodio

这个功能丰富的扩展将满足您所有的 Git 需求。eamodio 使用 CodeLens UI 向您展示最近的提交、作者数量、内联 blame 注释，并提供 Peek 窗口用于查看完整历史记录。请查看扩展的README以获取完整功能列表。该扩展获得了 14 个五星评价，是一款评价很高、非常优秀的扩展。

animation showing gitlens

Azure Application Insights

市场 - Azure Application Insights

作者 - Microsoft

正如您所料，这是 VS Code 团队成员喜爱的扩展之一。使用此扩展可以在 VS Code 中直接查看生产服务的相关信息！

app insights

CodeMetrics

市场 - CodeMetrics

作者 - Kiss Tamás

想象一下，您有这样一位喜欢编写复杂函数的同事。他们觉得这很酷，却不太关心可维护性。使用此扩展可以向他们展示其函数的复杂性，也可以检查您正在编写的源代码的度量。

code metrics

此外，您还可以自定义描述。这是我们团队喜欢使用的配置

"codemetrics.basics.ComplexityLevelExtremeDescription": "😱",
"codemetrics.basics.ComplexityLevelHighDescription": "😳",
"codemetrics.basics.ComplexityLevelLowDescription": "🤓",
"codemetrics.basics.ComplexityLevelNormalDescription": "🤔",
"codemetrics.basics.ComplexityTemplate": "Complexity is {0} {1}"

如您所见，我们喜欢表情符号。