sublime文本模板插件_适用于JavaScript开发人员的10个基本Sublime文本插件

sublime文本模板插件

在本文中，我将为JavaScript开发人员概述十个必备的Sublime Text插件，每个插件都可以改善您的工作流程并提高工作效率。

Sublime Text是一款出色的应用程序，几乎所有开发人员都可以在其工具箱中使用。 它是一个跨平台的，高度可定制的高级文本编辑器，位于功能齐全的IDE （众所周知非常耗资源）和命令行编辑器（如Vim或Emacs （学习曲线陡峭））之间。

近年来，Sublime赢得了Visual Studio Code和Atom的欢迎竞争，但是Sublime Text仍然拥有自己的优势，它的速度无疑无可争议，能够比其他文件更快地打开较大的文件。

Sublime如此出色的原因之一是其可扩展的插件体系结构。 这使开发人员可以轻松地通过代码完成或嵌入远程API文档等新功能来扩展Sublime的核心功能。 Sublime Text没有开箱即用地启用插件：它们通常是通过第三方包装管理器（简称为Package Control）安装的 。 要以Sublime Text安装Package Control，请遵循其网站上的安装指南 。

因此，让我们开始吧！

1. 通天塔

当然，我列表中的第一个是Babel插件。 该插件为您的ES6 / 2015和React JSX代码添加了正确的语法突出显示。 安装插件后，首先要做的就是将其设置为所有JavaScript和TypeScript文件类型的默认语法。

如果您尚未发现Babel的快乐，我强烈建议您。 它允许您将ES6 / ES7 / ESNext，JSX和TypeScript代码编译为ES5，以全面支持浏览器。 它与所有流行的构建工具和CLI集成良好。 显然，它不支持旧版浏览器，但是如果需要支持IE10及以下版本，可以按照其注意事项页面上的提示进行操作。

2. SublimeLinter

接下来是SublimeLinter，它提供了惊人的ESLint和JSHint到Sublime的集成。 linter将检查您的代码，并根据可随源代码一起检入的配置文件，验证其是否具有正确的样式和正确的语法。 无论您是初学者还是一生中的大部分时间都在编程：在JavaScript中，短绒是必不可少的。 退房ESLint或JSHint有关网页，看看他们能为你做什么。 根据您为项目选择的内容，还需要SublimeLinter-eslint或SublimeLInter-jshint的支持包。

为了使这两种方法都能正常工作，您必须在项目依赖项中包含一个linter或将其全局安装：

npm install --save-dev eslint

如果不确定如何使用npm，请查看我们的Node Package Manager入门教程。

如果已正确安装和配置它，则在打开或保存JavaScript文件时应该会看到所做的更改。 该插件具有令人难以置信的可配置性，并且可以通过多种方式进行报告，这些方式可能会更适合您的工作流程。 默认情况下，错误说明将在编辑器底部的状态栏中报告。

3. Vue语法突出显示

对于那些使用惊人的Evan You构建的坚如磐石的框架的人，在使用*.vue模板时，您将需要一些额外的帮助来使代码可读。 Vue语法高亮有帮助。

4. 侧边栏增强功能

列出此列表的第一个不仅专门用于JavaScript的插件必须是SideBar Enhancements。 开箱即用的Sublime Text具有很少的用于处理侧边栏文件树中文件的选项。 简而言之，SideBarEnhancements修复了该问题。 该插件特别提供了文件和文件夹的“ 移至废纸 option”选项，“ 打开..”选项，甚至剪贴板。 它还使您可以在Web浏览器中打开文件，将文件内容复制为data:uri base64 （对于在CSS中嵌入图像特别方便），并提供了许多搜索操作。 另外，它与SideBarGit很好地集成在一起，可以直接从侧边栏提供Git命令。

随着JavaScript代码库规模的不断扩大，一种明智的方法是必须在项目中导航和操纵项目的文件。 因此，此插件成为必须。

5. JsPrettier

您还是您的团队更喜欢采用全自动的整理方法以完全确保其完美？ 然后，您可能正在使用Prettier ，这是一种固执的代码格式化程序。 如果是的话，能够看到您当前正在编辑的文件上的更改并且不必等待构建为您进行更改就很好吗？ 这就是Prettier的用处。此插件允许开发人员从Sublime中对其正在编辑的当前文件运行Prettier。

免费学习PHP！

全面介绍PHP和MySQL，从而实现服务器端编程的飞跃。

原价$ 11.95 您的完全免费

免费获得这本书

如果您没有将Prettier用作自动化工具，则此插件可以用作现代Sublime Text插件（​​例如JsFormat）的现代替代品，该插件可以帮助压缩文件提高可读性，或者只是降低编码标准。

但是，如果您已经在项目中使用ESLint，则ESLint-Formatter可能会更有益，因为它将在您当前正在编辑的文件上运行eslint --fix 。

6. 尾随空间

如果您是在团队环境中或在没有过分定制的环境中工作，则此插件将很快成为密友。 没有比在实际的代码中什么都没做的提交中的行更改更令人讨厌的了，而是在行的末尾更改了一个简单的，无用的空间。

但是，如果您是那种试图将Sublime Text插件保持简洁的人，则可以在用户首选项中添加"trailing_spaces_trim_on_save": true ，以使Sublime Text在保存时为您删除。 我更喜欢能够看到它们的位置，自己进行更改，并具有能够将它们捕获到我当时未明确修改的其他文件中的额外好处。 即使您启用了该选项，也可以安装此插件，以防万一。

7. GitGutter

如果您是少数几个不使用Git进行源代码控制的人之一，则可以跳过这一步。 但是对于我们这些人来说，GitGutter是Sublime Text的绝佳补充。 它带来的主要功能是：

1. 装订线图标 ，指示已插入，已修改或已删除的行
2. Diff Popup ，有关修改行的详细信息
3. 状态栏文本 ，有关文件和存储库的信息
4. 转到Change ，以轻松在修改过的行之间导航。

它可能不会对您的工作流程做出任何重大改进，但这是一个非常不错的补充。

8. 支架高光

此插件排在此列表的后面，但它可能是整个列表中最重要的Sublime Text插件之一。 BrackHighlighter所做的只是在匹配的支架，花括号，括号或标签中添加切纸器图标和颜色编码。 但是它的真正作用以及使其如此重要的原因是，它允许开发人员保持理智 。

如果您是自定义书呆子，则可以对该插件进行高度配置，使其看起来像您想要的样子。 查看他们的文档以获取更多信息。

9. Markdown预览

希望您至少保留一些有关所构建内容的文档，即使它只是项目根目录中的简单README.md文件也是如此。 如果是的话，能够在提交之前查看该Markdown代码的预览不是很好吗？ Sublime Text默认包含一些不错的Markdown语法高亮显示，但是它缺少任何方式来查看Markdown的实际呈现方式……这可能并不总是您想要的。

10. Boxy主题

Sublime Text在许多方面都非常快速，易于使用并且功能强大。 但请在这里说实话：开箱即用的外观看起来并不那么好，尤其是当您将其与某些竞争对手进行比较时。 通常，我不会考虑将主题添加到这样的列表中，但是在Sublime Text 3主题中，现在允许我们更改边栏中的文件图标，这真是太好了！ Boxy不是唯一可以做到这一点的主题，但是Boxy不仅仅是一个主题：它是其中的一组，并且它们以自己的方式在美学上都非常令人愉悦。 如果这些都不吸引您， Setti_UI也是一个不错的选择。

结论

因此，我们有了它-用于JavaScript开发的十个必不可少的Sublime Text插件。 我敦促您尝试其中的一两个，并让我知道您在评论中的情况。

如果我不喜欢您喜欢的插件，请告诉我，我会考虑将其添加到列表中。

在我走之前，请记住Sublime Text不是免费软件。 它具有无限制的试用版（偶尔会出现nag屏幕），但单个用户的许可费用为70美元 。 如果您一整天都在和文本编辑器一起工作，那将是一笔值得的投资！

翻译自: https://www.sitepoint.com/essential-sublime-text-javascript-plugins/

sublime文本模板插件