记录安装配置 Sublime 的过程，同时列出所用到的插件，方便自己在新系统新电脑上快速用上熟悉的 Sublime。

开始使用

软件下载

• 一直使用的是 Sublime 3，直接转到 3 的 下载页面 好了。

用户设置

• Preferences/Settings - User，设置字体为 Consolas 雅黑混合体 yx5g，字号11，tab 转空格，显示空格和制表符。

1
2
3
4
5
6
7
8

"font_face": "Yahei Consolas Hybrid",
"font_size": 11,
"translate_tabs_to_spaces": true,
"draw_white_space": "all",

/*统一使用 UTF-8 编码和 UNIX 风格的换行符(LF, 0x0A)*/
"default_line_ending": "unix",
"default_encoding": "UTF-8",

其他设置参考 Preferences/Settings - Default。

基础插件

Package Control

Package Control

• 用于管理插件的插件，基础中的基础。之后列的插件全部通过 Package Control 安装。

插件使用与安装: https://packagecontrol.io/installation

Convert​To​UTF8

• 文本编码自动转换，减少中日韩文乱码问题。

插件安装: Ctrl+Shift+P, Package Control: Installed Packages, 搜索 Convert​To​UTF8

IMESupport

• 解决输入法选字框不跟随问题。

Side​Bar​Enhancements

• 自带边栏功能太少，必须安装此插件增强一下。

主题配色

Theme - Spacegray

• Spacegray 主题的 Base16 Eighties Dark 配色方案看着最顺眼，用着最舒服。

  

代码规范

Sublime​Linter

• 用于管理其他 code linting 代码规范插件。

使用说明: http://sublimelinter.readthedocs.org/en/latest/installation.html#installing-via-pc

Sublime​Linter-jshint

• 基于 JSHint ，用于检查规范 JavaScript 代码。

NPM 依赖包: npm install -g jshint 使用说明: https://github.com/SublimeLinter/SublimeLinter-jshint

Sublime​Linter-csslint

• 基于 CSSLint ，用于检查规范 CSS 代码。

NPM 依赖包: npm install -g csslint 使用说明: https://github.com/SublimeLinter/SublimeLinter-csslint

Sublime​Linter-contrib-htmlhint

• 基于 HTMLHint ，用于检查规范 HTML 代码。

NPM 依赖包: npm install -g htmlhint@latest 使用说明: https://github.com/mmaday/SublimeLinter-contrib-htmlhint

常用插件

HTML-CSS-JS Prettify

• 格式化 HTML, CSS, JavaScript 及 JSON 代码。

Color Highlighter

• 直接在代码中预览颜色。

Stylus

• 使代码高亮支持 Stylus。

Stylus Clean Completions

• Stylus 代码自动补全。

AutoFileName

• 文件名自动补全。

  

Can I Use

• http://caniuse.com/ 的插件版，快速查询 HTML, CSS 等前端技术的浏览器兼容性

BracketHighlighter

• 调整各类括号匹配的高亮样式

To be added

相关链接

1. Package Control: https://packagecontrol.io/
2. SublimeLinter: http://sublimelinter.readthedocs.org/
3. JSHint: http://jshint.com/
4. CSSLint: https://github.com/CSSLint/csslint
5. HTMLHint: http://htmlhint.com/
6. Stylus: http://learnboost.github.io/stylus/