安装Package Control
在安装插件之前，需要让sublime安装Package Control。打开Sublime Text的控制台，快捷键ctrl + ~，在控制台中输入以下代码。
import urllib.request,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)安装插件
-
emmet：
前端神器。一个可以极大提高web开发者HTML和CSS工作效率的工具箱组件。
查看介绍 -
CSS3：
CSS3语法高亮、CSS语法提示，美中不足的是缺少游览器私有属性高亮。
查看介绍 -
CSS Extended Completions：
关联CSS文件，智能提示css文件中的类名，非常好用。
查看介绍 -
JavaScript Completions
支持javascript原生语法提示，妈妈再也不用担心我输入document.getElementById(id)。
查看介绍 -
jQuery
为jQuery的大部分方法提供了示例代码段，让jQuery的API更加容易使用。
查看介绍 -
ColorHighlighter
它可以展示你所选择的颜色代码（像“#FFFFFF”, “rgb(255,255,255)”, “white”）的真正颜色。同时它还包含一个颜色选择器让你可以方便地更改颜色。
查看介绍 -
BracketHighlighter
括号以及标签层级显示，不用担心选中的代码属于哪个代码块，一目了然。
查看介绍 -
HTML-CSS-JS Prettify
THML、CSS、JS代码格式化，压缩过后的代码可以通过该工具复原。
查看介绍 -
AlignTab
使用正则表达式来帮助代码对齐，比如几行代码以=号对齐。
查看介绍
以上插件覆盖HTML，CSS，JavaScript，jQuery，CSS颜色显示，代码块级高亮，代码格式化，代码对齐，满足绝大多数前端的需求。
至于用Sass就装Sass，Sassbuild，git就下sublimeGit，git Gutter，想用某个主题就下主题，想扩展侧边栏就扩展侧边栏，这毕竟不是每个人必须的。
这里再推荐一个主题插件，主题库比较丰富，感觉大多数人都能用上，避免视觉疲劳：
-
Colorsublime
安装完成后，可输入Install Theme，在线更换主题。主题库有上百种，这个很不错。
查看介绍 - cssrem
- 下载链接：https://github.com/hyb628/cssrem
进入packages目录：Sublime Text -> Preferences -> Browse Packages...
复制下载的cssrem目录到刚才的packges目录里。
重启Sublime Text 。
Trailing spaces
- 功能：检测并一键去除代码中多余的空格
- 简介：还在纠结代码中有多余的空格而显得代码不规范？或是有处女座情节？次插件帮你实现发现多余空格、一键删除空格、保存时自动删除多余空格，让你的代码规范清爽起来
- 使用：安装插件并重启，即可自动提示多余空格。一键删除多余空格：CTRL+SHITF+T（需配置），更多配置请点击标题。
- 快捷键配置：在Preferences / Key Bindings – User加上代码（数组内）{ “keys”: [“ctrl+shift+t”], “command”: “delete_trailing_spaces” },
auto-save
- 功能：自动保存文件
- 简介：为保存提供了方便
- 使用：默认是不会自动保存，按快捷键Ctrl+Shift+S开启。
- 快捷键配置方法：首选项-快捷键设置，在数组内添加{ “keys”: [“ctrl+shift+s”], “command”: “auto_save” },如需自动启用，首选项-插件-auto-save—settings-usre粘帖一下配置
{
“auto_save_on_modified”: true,
“auto_save_delay_in_seconds”: 10,
“auto_save_all_files”: true,
“auto_save_current_file”: “”,
“auto_save_backup”: false,
“auto_save_backup_suffix”: “autosave”
}
view in browser
- 功能：通过默认浏览器打开文件
- 简介：方便打开浏览器检查编译效果
- 使用：快捷键配置方法：首选项-快捷键设置，在数组内添加快捷键：F12{ “keys”: [“f12”], “command”: “open_in_browser” },
AutoFileName
- 功能：快捷输入文件名
- 简介：自动完成文件名的输入，如图片选取
- 使用：输入”/”即可看到相对于本项目文件夹的其他文件
SublimeLinter
- 功能：代码检查
- 简介：支持JavaScript、CSS、HTML、Java、PHP、Python、Ruby等十多种开发语言
- 使用：需要配置相应语言的环境，要检查JavaScript代码需要安装node.js，检查PHP代码需要安装PHP并配置环境等。
Bracket Highlighter
- 功能：代码匹配
- 简介：可匹配[], (), {}, “”, ”, ，高亮标记，便于查看起始和结束标记