带你了解Sublime Text的使用

Sublime Text算是前端开发中最常使用的文本编辑器之一，对于前端工程师来说熟悉手中的编辑器就像熟悉筷子一样重要。Sublime Text的入门文章网上已经太多了，本文只关注能提升前端工程师工作效率的技巧和插件。

一晃已经接近2015年，过去数年里前端开发的发展日新月异：浏览器里充斥着新增加的CSS特性（以及这些特性的N种实现），JavaScript也不像原来那样只用作给单一页面加点特效或者提交Ajax请求这么简单，我们手边有了Jade，Sass，TypeScript等等一打甚至更多种能生成HTML，CSS，JavaScript的语言，默认安装的Sublime Text已经完全无法提供这些新的语言、新的特性所需要的语法高亮和智能感知。这一节介绍了一些Package来辅助Sublime Text实现更好地语法高亮。

JavaScript Next

JavaScript Next 提供了比默认JavaScript Package更好的语法高亮，而且他完美支持ECMAScript 6，如果你知道ECMAScript 6，或许也感受过默认安装的Sublime Text不支持modules，succinct methods, arrow functions, classes, generators, and accessors 带来的不便。

CSS3

嗯是的，就是CSS3，默认安装的Sublime Text对CSS3的支持让人抓狂，帧动画？别开玩笑了你只会看到一片白色的纯文本一样的代码。事实上不光CSS3，我建议用CSS3 Package完全替代原来的CSS Package来完成语法高亮。

SCSS

Sass的开发人员们，我建议你们使用SCSS Package，是的我也觉得有.sass和.scss是很脑残的设定，但是我想大多数Sass开发人员实际上写的都是.scss，毕竟.scss更“像”我们熟悉的原生CSS。

当然Stylus和LESS也是写CSS的好工具，事实上我更喜欢LESS。

其他Package

CoffeeScript的开发人员少不了Better-Coffescript，这个Package比Package Control里官方的CoffeeScript Package要好得多，后者已经很久没有维护更新了。嗯，TypeScript也是个不错的选择，当然我想Visual Studio或许是更好地TypeScript工具。

Haml Package为默认的工具增加了嵌套语言的支持，包括JavaScript，CSS，Sass等等，语法高亮比以前更方便。Slim和Jade也提供了各自的语法高亮支持，这两种语言我还不是非常了解，如果有更好的插件提供请一定分享出来。

Sublime Text有无数有趣又有用的插件，社区的支持也是我一直用Sublime Text的原因。如果我们找一打工程师坐下来讨论Sublime Text的插件，哦算了我们还是聊聊宇宙和平吧…… 前端工程师常用的插件比如CTag不再赘述，这里说几个有趣的。

Color Highlighter

这个插件我等了很久了，我最早用Sublime Text写CSS时候就在想“这堆颜色码谁知道是什么颜色”… Color Highlighter这个插件会检测CSS文件中的颜色码，不论是Hex码或者RGB码都能很好的显示。Color Highlighter能够设置成用背景色或者边框提示颜色，我一般在Settings里做这样的设置：