关于VS Code的33个扩展,其开发以及如何管理的故事

该材料的作者(我们今天出版的翻译)为VS Code创建了33个扩展。 他决定与喜欢这个编辑器的人分享开发和支持扩展的方法。 此外,他还简要介绍了他的项目。 也许您会在其中找到对您有用的东西。



如何编写扩展


我致力于生产工作并热爱自动化,因此我开发了一个组织良好的过程来开发VS Code扩展。 我将向您介绍此过程的主要组成部分。

▍工具


我写了一个非常简单的工具 ,可以帮助您使用模板快速开始新项目。 相应的实用程序如下所示:

  • 它接受一个文件夹作为输入(这就是所谓的“模板”)。
  • 它使用handlebars包处理所有文件,并在处理过程中询问有关用什么替换每个找到的占位符(例如{{name}} )的问题。
  • 结果,她形成了一个新文件夹,其中的文件包含为回答她的问题而输入的内容。

我曾考虑过使用yeoman实用程序来处理模板,但是,就我的需求而言,它似乎是不合理地复杂。 我使用了khaos工具,但它不受支持,并且不会自动更新模板,并且在需要使用它们时手动对其进行手动更新并不是特别方便。

▍模板


这就是我使用template-vscode-extension开始为VS Code开发新扩展的方式。


创建一个新项目

输入计划问题的答案后,我可以使用有效的扩展程序,例如“ Hello,world!”。 VS Code。 模板包含许多帮助程序功能,事实证明,开发扩展程序时经常使用这些功能。 特别是,该模板支持从.vscode文件夹中加载用户配置文件,自动注册命令,它可以基于活动文件找到当前的根目录并解决其他类似问题。

如果我可以倒时的话,我可能会将所有这些辅助函数放在一个独立的包中,例如vscode-utils ,而不是在每个扩展开发项目中都复制这些函数。 但是不幸的是,然后我不知道会创建几十个扩展。 现在,我必须花一些时间在扩展的所有项目中更新相应的代码。

如果您打算为VS Code开发扩展,我建议您创建自己的模板,也许以我的模板为基础。

documentation有用的文件


在开发过程中,我总是手头有API VS Code的文档 。 起初,使用此文档(此页面很大)并不是特别方便,但是如果您花一些时间快速查看它,并且了解了哪些API可用,那么使用起来就很舒服。 通常,我可以注意到,可用的API集合对我来说还不错。

顺便说一句,如果您想为VS Code开发扩展,那么阅读文档的本部分将非常有用。

▍关于我开发的扩展


我正在开发扩展程序以解决各种问题,我们将在下面讨论它们。 另外,其中一些扩展帮助我开发其他扩展。

我的扩展


正如我所说,我追求生产力,因此我的许多扩展都旨在提高劳动生产率。 我尝试不处理自行车的不断发明,而是尝试实现各个扩展部分之间功能的清晰区分,以使它们的联合使用不会引起问题。

我不知道这是好是坏,但是我喜欢为VS Code创建扩展。 此外,可以自动化的任务流不会枯竭。 这就是为什么在我写完第一个扩展名之后,我做了第二个扩展名,然后是第三个扩展名,结果达到了第三个扩展名。

现在,我将简要介绍一下我的扩展。 有关它们的详细信息可以在其页面上找到。

▍扩展以创建扩展


1号 调试管理器


Debug Manager扩展允许您甚至从终端开始调试,而无需创建任务或配置文件。 我创建此扩展是因为我不想用不必要的文件阻塞存储库(例如,谁在使用任务?)。 我相信从终端启动调试器是一项非常有用的功能,因此应将其包含在VS Code中。


从终端运行调试器

2号 StatusBar调试器


StatusBar Debugger扩展将调试控件添加到程序状态栏。 这比标准的调试面板要方便得多。 另外,如果VS Code提供更多调试数据 ,我的扩展范围会更好。

3号 安装.VSIX


通过安装.VSIX扩展名 ,您可以直接从面板安装.vsix文件。 进行此扩展的原因是这样的文件的标准安装过程不方便 。

4号 凹凸


Bump扩展名允许您增加项目版本号,并将新数据输入更改日志。 该工具根据其自身的内部逻辑起作用,但可以自定义。 我创建它的原因是,任何体面的扩展都需要更改日志,但这并不意味着该扩展的开发人员必须手动输入日志。 这是我最喜欢的扩展之一。 也许我会基于它创建一个命令行工具,因为有一天我希望它允许GitHub版本的自动化。


使用凹凸扩展

5号 优化图像


“ 优化图像”扩展允许您使用用户选择的外部应用程序来优化项目中可用的图像。 一个团队-工作就完成了。

▍项目管理


6号 项目+


Projects +扩展名用于管理项目。 它具有丰富的功能,可以进行配置,自动查找项目。 这种类型的最广泛使用的扩展之一是Project Manager ,但是我有大约一百个存储库,并且我需要正确的工具来管理它们,其中之一是对无限嵌套组的支持。


使用项目+扩展

to管理待办事项清单


7号 待办事项+


Todo +扩展名简化了待办事项列表的使用。 这是一个易于使用和可自定义的功能强大的工具。 如果您不需要TODO文件的语法突出显示,或者对标准的内置突出显示感到满意,则可以尝试使用不错的Todo Tree扩展名。


使用Todo +和项目级别信息突出显示语法

8号 突出显示


Highlight扩展是高级正则表达式语法突出显示工具。 这对于使用待办事项列表,注释等很有用。 TODO Highlight扩展在该领域非常受欢迎,但我的扩展功能更强大,功能更强大。 另外,它可能工作更快。

9号 降价待办事项


Markdown Todo扩展使您可以轻松使用Markdown文件中的待办事项列表。 没什么特别的,但是它允许您在markdown文件中使用Todo +的功能。

10号 项目+待办事项+


使用Projects + Todo +扩展名,您可以从鸟瞰角度分析项目,以查看将所有todo文件汇总到一个文件中的结果。 如果您使用Projects +扩展名进行项目管理,并使用Todo +处理待办事项列表,那么借助此扩展程序,您可以在一处从所有(或某些)项目中收集待办事项列表。

▍用于打开文件的扩展


对我来说重要的是能够在不同的应用程序或网页之间快速切换的能力。 这就是为什么我为VS Code创建了一系列扩展来简化此类问题的解决方案的原因。

11号 在应用程序中打开


“ 在应用程序中打开”扩展允许您在默认应用程序或开发人员决定使用的应用程序中打开任意文件。 这是一个通用扩展。

12号 在浏览器中打开


在浏览器中打开扩展将命令添加到编辑器,使您可以在任何浏览器中甚至在所有可用浏览器中立即打开当前文件或项目。

13号 用代码打开


Open in Code扩展使您可以轻松地在VS Code和VS Code Insiders之间进行切换。

14号 在取景器中打开


“ 在Finder中打开”扩展名旨在在Finder文件管理器中打开当前文件或项目。

15号 在github中打开


“ 在GitHub中打开”扩展程序允许您在github.com上打开当前项目或文件。 有很多扩展程序可以解决此问题,但是当我尝试使用它们时,结果发现它们具有太多我不需要的功能。

16号 在吉特大厦中打开


“ 在GitTower中打开”扩展将命令添加到编辑器中,以在GitTower中打开当前项目。

17号 在市场上开放


“ 在市场中打开”扩展使编辑人员可以使用团队在VS Code的扩展目录中打开当前项目。

18号 在node_modules中打开


“ 在node_modules中打开”扩展使您可以在node_modules文件夹中找到与所选文本或任意行相对应的模块,然后打开其文件夹。 当开发人员想要更好地了解他所使用的模块时,这是有用的。

19号 在npm中打开


“ 在NPM中打开”扩展名允许您在npm目录中打开模块页面。 方便查看模块的帮助信息。

20号 开船


“ 在船上打开”扩展将命令添加到编辑器,以在“船上”打开当前项目。 不幸的是,希普停止工作了。 因此,现在,为了不忘记我收到的有关项目中问题的信息,我必须在Noty中使用特殊的提醒表。

21号 在终端中打开


在终端中打开扩展可轻松在终端中打开当前项目。

22号 在传输中打开


“ 在传输中打开”扩展名允许您在“传输”中打开当前文件或项目。

▍杂项


23号 浏览器刷新


通过“ 浏览器刷新”扩展程序,您可以直接从VS Code按⌘R刷新浏览器中的页面,而无需切换到浏览器。 在无法使用交互式重新加载选项的情况下,以及不需要browser-sync刷新页面而不需要此功能的情况下,此扩展很有用。

24号 指令


命令扩展允许您从状态栏中调用任意命令。 支持参数传递。


由命令创建的自定义命令

25号 差异


Diff扩展名使您可以比较打开的文件。 我创建此扩展是因为code-diff path1 path2太慢。

26号 Git文件历史


Git文件历史记录扩展名简化了当前文件与其先前版本之间差异的分析。 有很多扩展程序可以解决此问题,但是当我尝试使用它们时,结果发现它们要么挤满了不必要的功能,要么就无法使用。

27号 Github通知


安全且可自定义的GitHub Notifications扩展程序旨在在状态栏上显示GitHub通知信息。

28号 Monokai Night主题


Monokai Night Theme是基于Monokai主题的简约深色主题。 我之所以创建它,是因为我无法从现有主题中找到适合自己的东西。


Monokai Night主题

29号 否[不支持]


No [Unsupported]扩展名旨在从编辑器的标题中删除“ [Unsupported]”行。 该扩展名已被弃用,因此我建议改用Fix VSCode Checksums 。 不幸的是,即使经过这样的讨论,恼人的题词“ [不支持]”仍然没有消失。

30号 打开多个文件


使用“ 打开多个文件”扩展名,您可以同时打开某个文件夹中的所有文件。 如有必要,可以按模板过滤文件。

31号 搜索-打开所有结果


搜索-打开所有结果扩展程序使您可以使用单个命令同时显示所有搜索结果。

32号 码头经理


Terminals Manager扩展可以一次自动执行多个终端的工作,例如,执行其中的一些命令。 我必须说终端管理器是我的第一个扩展。 如果您使用终端-建议您尝试一下。

33号 传送


Transmit扩展为编辑器提供了几个用于组织与Transmit交互的命令。

扩展管理


管理多个存储库可能是一项艰巨的任务。 我会告诉你我该怎么做。

▍定期提交


迟早需要您对所有受支持的存储库进行一些更改。 这归结为以下事实:许多存储库必须执行相同的提交。 很快,它变成了一项无聊的任务。

为了自动解决此问题,我创建了autogit-一种工具,当您将其应用于许多存储库时,该工具可用于执行命令。


使用autogit运行命令

我一直在寻找使用autogit新方法。 例如,最近,我使用此工具在存储VS Code扩展代码的所有存储库中进行了以下更改:

  • 使用webpack构建。 这导致启动速度提高了大约80%。
  • 忽略package-lock.json 。 该文件仅阻塞我的提交历史记录。 这是有关此主题的一些很好的材料。
  • 更新tsconfig.json 。 我大量使用了语言的新功能,特别是异步功能。 如果将转换的目标设置为<= es5 ,则会将它们转置为非常慢的构造。 由于VS Code了解现代代码,因此不再需要此代码。
  • 卸载TSLint 。 我发现,基本上,我不注意棉绒的技巧,因此我摆脱了这个机会。
  • 在参考材料中使用高分辨率徽标。 我以前使用的是128x128徽标,现在,为了改善参考资料的外观,我使用了更好的图像。 我不能说照片本身就是一个奇迹,但这是另一回事了。

在一个存储库中进行此类更改的时间并不长,但是当涉及到33个存储库时,如果没有自动化工具则很难生存。

with与GitHub同步描述和关键字


这里讨论的内容不是必须要做的,但是自动执行描述和关键字同步的工具不会对我造成伤害。 这个任务可以由我的autogit和autogit-command-github-sync工具的工具来处理。


使用autogit同步描述和关键字

但是autogit-command-github-publish是我用于自动创建新存储库的工具。

▍报告


在创建了几个扩展后不久,我开始对它们的流行程度,随着时间的推移,它们的下载数量如何变化感兴趣。 您可以在特殊页面上找到有关某个开发人员的所有扩展的信息。 例如, 这是我的页面。 但是,此页面未提供信息,例如,自上次检查以来已完成了多少扩展下载。 这就是为什么我创建rssa的原因 。 此工具使您可以跟踪对URL可访问的任何内容的更改。


rssa收到的数据

文本是好的,但是将数据显示在图形中会更好。 现在,我正在开发解决此问题的工具,但尚未发布。 例如,此处看起来像Todo +扩展的下载时间表,该时间表基于使用rssa获得的数据而rssa 。


待办事项+下载时间表

在某些地方,您可以看到下载数量急剧增加。 在发布更新时会发生这种情况,因为系统会将扩展更新的安装视为下载。 这导致一个事实,任何人都可以成为扩展程序的作者,下载量达到一百万,编写并发布了许多更新。 顺便说一下,这是VS Code扩展目录的问题之一 。

总结


有一次,我认为就VS Code发布的扩展数量而言,我仅次于Microsoft。 然而,事实证明, 其中一些比我多2。 因此,我继续写扩展。

亲爱的读者们! 您是否为VS Code编写扩展程序?

Source: https://habr.com/ru/post/zh-CN429550/


All Articles