sublime 插件安装

设置空格可视化

1、菜单栏Preferences->Settings - Default打开默认设置；

2、拷贝默认设置中"draw_white_space": "selection",到Preferences->Settings - User并改为"draw_white_space": "all",保存

设置tab转换为4个空格

1、菜单栏Preferences->Settings - Default打开默认设置；

2、拷贝默认设置中"translate_tabs_to_spaces": false,到Preferences->Settings - User并改为"translate_tabs_to_spaces": true,保存

创建PHP编译系统

添加 PHP 的 build system，Tools->Build System-> New Build System ：

新建一个，默认的内容是：

{ "shell_cmd": "make"}

修改为：

{ "cmd": ["php", "$file"], "file_regex": "php$", "selector": "source.php" }

保存在默认的目录下即可，注意修改文件名为 php.sublime-build 。

重启sublime text,就可以用Ctrl+B来编译.php文件了；

配置

点击preferences－setting user，个人设置如下：

{

//字体大小

"font_size": 13.0,

//字体类型

"font_face": "Consolas",

// 设置每一行到顶部，以像素为单位的间距，效果相当于行距

"line_padding_top": 2,

// 设置每一行到底部，以像素为单位的间距，效果相当于行距

"line_padding_bottom": 2,

// html和xml下突出显示光标所在标签的两端，影响HTML、XML、CSS等

"match_tags": true,

// 是否显示代码折叠按钮

"fold_buttons": true,

// 代码提示

"auto_complete": true,

// 默认编码格式

"default_encoding": "UTF-8",

// 左边边栏文件夹动画

"tree_animation_enabled": true,

//删除你想要忽略的插件

"ignored_packages":

[

"Vintage",

"YUI Compressor"

]}

插件设置：

左上角Sublime Text -> Preferences -> Package Settings ->插件名如果没有最后的"插件名"选项，说明你还没有安装此插件。

这里面一般有5个选项：

Settings- Default
Settings- User
Key Bildings - Default
Key Bildings - User

带有后缀Default的，为默认设置，每次升级插件都会重置这里的设置。所以尽量不要修改这里，否则升级会丢失你原先的设置。

带有后缀User的，为用户自定义设置，你可以把Default里面的设置全部复制一份到这里，然后再修改，这里存在的设置选项会覆盖Default里面的，即User的优先级更高。

Key Bildings为快捷键设置，默认的快捷键很有可能因为和其他快捷键冲突而无效，所以可以在Key Bildings - User里重新设置（格式可以仿照Default里的写法）。

AutoFileName——自动补全文件路径

j20m809hdgz.jpeg

Sidebar——侧边栏扩展

更多的右键选项

SublimeLinter——代码检测工具

1522312164612.jpg

这个插件最近才为SublimeText3重建和发布。新版本显然带来了很多新的有所不同的功能，而不是简单地把所有的Linter 放在一个包中，开发者允许用户在升级时选择并安装自己经常使用的Linter。很明显，这可以节省磁盘空间。“更多的定制”，这对用户是很友好的。

AllAutocomplete——代码自动补全

传统的Sublime Text自动补全插件仅仅在当前文件下工作。AllAutocomplete 可以搜索全部打开的标签页，这将极大的简化开发进程。当然，还有一个插件叫 CodeIntel，实现了一些IDE的功能并且为一些语言提供了“代码情报”： JavaScript, Mason, XBL, XUL, RHTML, SCSS, Python, HTML, Ruby, Python3, XML, Sass, XSLT, Django, HTML5, Perl, CSS, Twig, Less, Smarty, Node.js, Tcl, TemplateToolkit, PHP.

3.jpg

Alignment——代码对齐插件；

由于Ctrl+Alt+A可能跟某IM截图的快捷键冲突，修改Sublime Text 2快捷键的方法如下：

打开 Preferences=>Package Settings=>Alignment=>Key Bindding - User然后写入

[

{ "keys": ["ctrl+alt+f"], "command": "alignment" }

]

4.jpg

或者改成其他不冲突的快捷键即可

BracketHighlighter——括号高亮匹配；

插件用途：该插件用于高亮显示成对匹配的括号、引号或其它符号、标记，并可对匹配的一对符号之间的内容进行操作（这是关键功能）。

通过在用户定义的键盘映射文件中设置该插件的快捷键，可实现以下常用功能：

跳转到左侧括号的右端（或右侧括号的左端）；
选择匹配的一对括号内的文本，可选是否包含括号；

5.jpg

选择 HTML/XML 标签的标签名 (开始标签和闭合标签都会被选中，便于修改)；
选择光标所在处的属性及对应的值（光标必须在属性处，不能超出单词的最左或最右侧）；
折叠 / 展开一对匹配的括号内的文本；
用快捷面板中的括号将所选择的代码段括起来（用 Visual Studio 写 C# 代码时就有相同的功能）。

打开和折叠代码的某一部分就应该是这个样子的。

6.jpg

Emmet——快速编写HTML/CSS

7.jpg

8.jpg

编辑器中最流行的插件之一。Emmet，前身Zen Coding也是web开发者提高生产力最有效的方法之一。按下Tab键，Emmet就能把一个缩写展开成一个HTML和CSS代码块.

概括地说，Emmet是一个可以让你更快更高效地编写HTML和CSS，节省你大量时间的插件。怎么使用？你只需按约定的缩写形式书写而不用写整个代码，然后按“扩展”键，这些缩写就会自动扩展为对应的代码内容。比如，你只需要输入

((h4>a[rel=external])+p>img[width=500 height=320])*12

然后它会被扩展转换成12个列表项和紧随其后的图像。然后你就可以在此基础上再填写内容，就这么简单。

DocBlockr——自动注释生成

如果你遵循的编码的风格很严格，这款插件能够使你的任务更容易。DocBlokr 帮助你创造你的代码注释，通过解析功能，参数，变量，并且自动添加基本项目。

DocBlockr这个插件可以很好的生成js ,php 等语言函数注释,只需要在函数上面输入/** ,然后按tab 就会自动生成注释

9.jpg

ColorPicker——取色插件

通常，如果我们需要一个调色盘的时候，我们习惯使用Photoshop或是Gimp。但是一个完整的选色工具可以直接在你的编辑器中使用- Ctrl/Cmd + Shift + C。还有两个插件 GutterColor 和 ColorHighlightergutter可以在gutter中显示很棒的色彩高亮，简化了色彩代码的定位。