[[]318]]

若要精通某项技艺，务必先使工具锋利。对于软件工程师而言，日常工作中接触最多的工具可能就是编辑器了。从业至今，我尝试过多种编辑器，如、 IDEA、 Text等，目前频繁使用的则是 Code和Vim。实际上，我在其中部署了Vim插件，并采用Vim的按键模式进行编码。自从我意识到双手不离键盘能够显著提高工作效率后，我便尽量减少触碰鼠标的次数。

尝试过 Atom 的我，在初次使用时便感受到了 Vim 的轻盈，试用体验之后便毫不犹豫地放弃了 Atom。在 Atom 之前，我也有过其他的使用经历，然而，它每次保存文件时都会频繁弹出需要购买授权的提示窗口，这让我感到非常烦恼。

每次开始使用一款新的编辑器，我都会依照自己的开发习性对其进行细致的调整，直至达到满意的工作状态。在此过程中，我对编辑器的各项特性逐渐熟悉，这一过程往往需要花费数周时间。随后，我将从外观设置、风格校验、编码效能、功能升级等四个维度，逐一阐述如何进行配置，以提升工作效率和满意度。

外观配置

在考虑设计时，外观往往是首要考虑的因素。就配置而言，主要包括色彩搭配、图标设计以及字体选择等方面。常言道，萝卜青菜，各有所爱。在我目前的设置中，这些元素的基本情况从下图中即可一目了然sublime text js 格式化，在此提供给大家作为参考。

配色方案、图标设计、字体选择以及其它界面外观设置细节如下（请注意，若未安装相应插件，某些设置若直接应用将无法生效）：

{
  "editor.cursorStyle": "block",
  "editor.fontFamily": "Fira Code",
  "editor.fontLigatures": true,
  "editor.fontSize": 16,
  "editor.lineHeight": 24,
  "editor.lineNumbers": "on",
  "editor.minimap.enabled": false,
  "editor.renderIndentGuides": false,
  "editor.rulers": [120],
  "workbench.colorTheme": "Solarized Dark",
  "workbench.iconTheme": "vscode-great-icons"
}

风格检查

我之前撰写过一篇关于在 Git 提交阶段维护代码规范性的文章，名为《借助 husky 和 lint- 构建高效的代码审查流程》。对开发者来说，最理想的状况是编辑器在编写代码时即能提供即时反馈，而强制性的检查措施则主要是从团队角度确保代码风格的一致性和规范性。前端工程师所编写的代码主要包括：HTML、CSS以及JSON等，而与其相对应的代码检查工具则相对明确：

除了上述提到的 Lint 工具，还有一款非常实用的插件同样不容忽视，它几乎被所有主流的集成开发环境所支持。我们能够通过配置文件，在各个团队成员、不同的 IDE 以及不同的平台之间统一文件的缩进规则和编码风格，以此防止混乱现象的发生。以下是我常用的配置方案：

[*]
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
indent_style = space
indent_size = 2

[{*.yml,*.json}]
indent_style = space
indent_size = 2

实施风格审查后，随之而来的是按照既定风格规范进行文档格式化的迫切需求。经过多次尝试，目前仍在使用的格式化工具包括：

编码效率

谈及编码效能，连续六年几乎每日都在编码的我，目前最深刻的体会是：打字的速度似乎已无法跟上思维的节奏。在这种状况下，编码时必须设定合适的快捷键，同时灵活运用智能提示、代码模板以及自动填充功能，以实现速度的极致提升。

内置的智能建议功能相当强大，但我对预设的设置进行了以下调整，目的是实现类似 Vim 编辑器中的智能提示功能，即在任何位置，包括注释和字符串中都能激活智能提示。

{
  "editor.quickSuggestions": {
    "other": true,
    "comments": true,
    "strings": true
  },
}

接下来sublime text js 格式化，重点说说代码片段和自动补全两个效率提升利器。

代码片段

该工具在英文中被称为……，在市面上广泛使用的编辑器中均有提供支持。其核心原理在于提取出常用的代码模式，只需按下2至3个键，便可以生成N行代码。这些代码片段的积累既基于个人使用习惯，也得益于社区中累积的优秀编码模式。若您觉得这些模式不适合自己，可以对其进行修改（例如，可以寻找现有的插件进行模仿），以下是我常用的代码片段插件列表：

自动补全

自动补全功能在本质上与代码片段相似，但它在特定情境中，根据你的输入提供启发式建议，以预测你可能想要输入的内容。我平时使用的自动补全工具包括：

当然，若您打算用PHP进行其他语言的编码，那么您只需在市场上搜寻“PHP”相关资源即可。

功能增强

在提升工作效率的层面，除了上述代码片段和自动补全功能，我还增设了以下插件，这些插件有助于我更便捷地浏览及领会代码内容，同时也能在多个项目间进行流畅切换。

结语

说了这么多，相信读到这里的你也期望用工具来提高自己的效率。

提升工作效率有何途径？答案是肯定的，将简单任务进行重复操作，将重复任务规范化，再将规范任务实现自动化。一旦发现某个问题，利用插件予以解决，如此一来，工作效率自然会得到显著提升。

你都用了哪些插件呢？欢迎留言交流！

题外话

依据上述配置，我制作了三篇关于前端技术的短视频教程，在这些教程中，你可以直观地观察到我的实际操作成果。若你对这些内容感兴趣，不妨点击下方的链接查看。

如有侵权请联系删除！