近期在学习前端的相关知识中无意间了解到Sublime Text3，简单的学习之后，我发现确实很好用，强大的快捷键和插件立马就吸引我了，于是乎我入坑了... 我估计看到这里的同学们十有八九也是入坑了的，那我们一起来好好学习了解Sublime Text3！

    首先是去官网下载相应的版本  直通车

    无脑安装了之后激活（作为程序员我想大家都知道怎么做，就不多纠结了）

    然后就与我一起开启学习之旅吧！

 一、优良特性概述

      Sublime Text3编辑器会自动对编辑文件进行保存，打开文件会自动识别文件内容，版本三可以直接在编辑器中打开图片

二、常用快捷键及插件概述

 ctrl+p：goto anything快捷键

                         快速查找并打开文件 如：test/test.html

                         快速定位 如：@+选择名称 可直接搜索导航到匹配的选择项   

                         可一起使用 如：test/test.html@header

 Ctrl+Shift+P：打开命令面板  

                          快速切换编辑语言 如：Set Syntax:JavaScript     支持模糊匹配 js 

 Ctrl+G：跳转到第几行

 Ctrl+W：关闭当前打开文件

Ctrl+Shift+W：关闭所有打开文件

Ctrl+Shift+V：粘贴并格式化

Ctrl+D：选择单词，重复可增加选择下一个相同的单词  （多行游标）

                Ctrl+光标多选

                Ctrl+K-->Ctrl+D 跳过选取

                Atl+F3全选匹配内容

                Ctrl+A,然后再Ctrl+Shift+L 全选游标

ctrl+shift+D：复制当前行

Ctrl+L：选择行，重复可依次增加选择下一行

Ctrl+Shift+L：选择多行

Ctrl+Shift+Enter：在当前行前插入新行

Ctrl+X：删除当前行

Ctrl+M：跳转到对应括号

Ctrl+U：软撤销，撤销光标位置

Ctrl+J：选择标签内容

Ctrl+F：查找内容

Ctrl+Shift+F：查找并替换

Ctrl+H：替换

Ctrl+R：前往 method

Ctrl+N：新建窗口

Ctrl+K+B：开关侧栏

Ctrl+Shift+M：选中当前括号内容，重复可选着括号本身

Ctrl+F2：设置/删除标记

Ctrl+/：注释当前行

Ctrl+Shift+/：当前位置插入注释

Ctrl+Alt+/：块注释，并Focus到首行，写注释说明用的

Ctrl+Shift+A：选择当前标签前后，修改标签用的

F11：全屏

Shift+F11：全屏免打扰模式，只编辑当前文件

Alt+F3：选择所有相同的词

Alt+.：闭合标签

Alt+Shift+数字：分屏显示

Alt+数字：切换打开第N个文件

Shift+右键拖动：光标多不，用来更改或插入列内容

鼠标的前进后退键可切换Tab文件

按Ctrl+Shift+上下键，可替换行

Ctrl+] 增加缩进 [ 减小缩进。

三、插件

1.package control 主题安装

1、进入官网。（直通车）

2、选择sublime的版本 然后复制下面的代码。

3、进入sublime text 软件，选择view下的show console。

4、将代码粘贴进去按回车等待安装的完成。

5、安装完成后重启sublime text。

6、启用命令模式（ctrl+shift+p），输入package control:install package.

7、等待加载插件，加载完有很多的插件。

8、选择主题插件theme（主题） ****，有很多样式，可以去官网看，推荐flatland、soda、spacegray。。。在命令模式下选择一种，比如选择 theme spacegray。

9、等待安装，安装完成后会弹出使用说明，说明里有叫你把space eighties 下面的复制到自己用户的配置信息中，也就是preferences菜单下的settings user里将复制的代码粘贴进去。（打个逗号粘贴），保存后安装完成，sublime text的主题就会变成安装的主题样式。

pc：1. install Package 安装插件

       2. List Package 已经安装插件列表

       3. Remove Package 卸载插件

       4. Disable/Enable Package 禁用/启用插件

2.Emmet插件

           自动生成html5结构，Ctrl+E   

           > 号生成子元素 ，$ 产生序号，{ }产生内容

            如：   （ul>.item${content}*10）

                        ul>(li>a[href="index.htnl"])*4 

3.Snippet

       在Javascript语法环境中，Tools->Command Palette… (shift+command+P) 打开命令模式,输入Snippet，选择“Snippet:function"命令可以快速创建函数，通过tab键可以快速切换输入参数和函数体，通过sublime Text自带输入的缩写词也能自动补全代码语句,如输fun 选择提示的fun Function,就会生成函数：

function function_name (argument) {

// body...

},

输人ife选第一个回车，就会生成：

if (true) {} else{}

安装Javascript&NodeJs Snippets 以及jQuery插件, ,很方便的提高生产力,具体指令说明：https://packagecontrol.io/packages/JavaScript%20%26%20NodeJS%20Snippets ，https://packagecontrol.io/packages/jQuery

方便的完成回调函数

安装Insert Callback插件，https://packagecontrol.io/packages/Insert%20Callback

按alt+C就能自动生成回调函数。

《Sublime Text3 snippets》

Snippet Function

1.[ctrl+shift+P]+输入'pci'+输入'Snippet: Function'

2.输入'fun'+[Enter]，自动产生 function

3.输入'ife'，自动产生 if else

JavaScript snippets

1.[ctrl+shift+P]+输入'pci'+输入'JavaScript Completions'

2.输入'gi'，自动产生 getElementById

JQuery snippets

1.[ctrl+shift+P]+输入'pci'+输入'JQuery'

2.输入'get'，自动产生 get请求

3.输入'post'，自动产生 post请求

Insert Callback

1.[ctrl+shift+P]+输入'pci'+输入'Insert Callback'

2.[alt+C]，自动产生 callBack function

4.advanceNewFile插件

ctrl+n:新建

ctrl+s：保存；

安装advanceNewFile插件，ctrl+alt+n在该目录下创建文件或者命名文件；

Ctrl+Alt+N输入文件名即可在当前文件夹下创建文件；

Ctrl+Alt+N输入带路径的文件名即可在该路径下创建文件，如果路径不存在，便创建出该路径

5.htttpRequester

1.在Sublime内部，做服务器响应的测试Get请求

router.get('/',function(req,res){res.send('request with a resource');});

注释需要测试的路由地址//localhost:8080/users/并选中

ctrl+alt+R

200 OK服务器响应正确

在Sublime内部，做服务器响应的测试Post请求:

// POST http://www.baidu.com

// Content-type: application/x-www-form-urlencoded

// POST_BODY:

// ac=weeklyregister_register&code=weeklyregister&wapid=ma_62

6.nettus fetch插件

ctrl+shift+p--->输入nettus fetch回车--->ctrl_shift+p--->输入fetch manage来管理配置文件

使用fetch来下载jquery步骤：

ctrl+alt+n在某个目录下创建一个jQuery文件--->在该文件中输入ctrl+shift+p--->输入fetch file回车--->jquery回车下载。

在fetch配置文件中来增加新的类库（如：underscore.js）：

步骤如下：

在该文件中添加"underscore":"http://github.com/jashkenas/underscore/blob/master/underscore.min.js"和前一个参数以"逗号"来分隔。

ctrl+alt+n在某个目录下创建一个underscore文件--->在该文件中输入ctrl+shift+p--->输入fetch file回车--->jquery回车下载。

到github下载underscore.js文件

github上的underscore文件地址：

https://raw.githubusercontent.com/jashkenas/underscore/master/underscore-min.js

7. SideBarEnhancements插件

ctrl+shift+p —> Install Package —> 找到SideBarEnhancements

SideBarEnhancements

2. 配置预览快捷键

Preferences —> Key Bindings - User 将以下代码复制到数组中。

// chrome

{ "keys": ["f2"], "command": "side_bar_files_open_with",

"args": {

"paths": [],

"application": "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe",

"extensions":".*"

}

},

// firefox

{ "keys": ["f3"], "command": "side_bar_files_open_with",

"args": {

"paths": [],

"application": "D:/Program Files (x86)/Mozilla Firefox/firefox.exe",

"extensions":".*"

}

},

// ie

{ "keys": ["f4"], "command": "side_bar_files_open_with",

"args": {

"paths": [],

"application": "C:/Program Files/Internet Explorer/iexplore.exe",

"extensions":".*"

}

}

上面的代码中有两处需要注意的地方，一个是keys表示快捷键，即f2可以启动chrome进行预览。另一个是application，表示浏览器所在的安装路径，只有路径配置正确，才能够正常调用浏览器

8.校验插件SublimeLinter

安装jshint的步骤：

1)ctrl+shift+p打开命令模式--->输入pcip回车--->输入sublimelinter回车（是总体框架，如果需要对js进行校验的话，还需要安装针对js的校验插件，其中有两套js校验插件，分别是jslint,jshint,其中jshint是最流行的，此处也是安装jshint为主）--->ctrl+shift+p--->输入sublimelinter-jshint回车进行安装--->下载node.js进行安装（因为用命令方式安装jshint插件用到npw install(node版本库），到node.js官网下载node-v6.2.0-x64.msi并且点击安装，安装完成之后--->需要在命令行安装jshint,命令代码时：npw install -g jshint。

如果没有安装node的话，那么npw命令就是无效的。

注意：在sublime text使用sublimelinter jshint，那么jshint版本必须大于2.4。

jshint文档网址：jshint.com/docs/options/

如何在js中使用校验呢？步骤如下：

1)ctrl+alt+n打开一个新文件--->切换到js语法模式--->如果用户在js文件上写上var x=123后面却没有分号的话，那么该行的左边就会有个黄色的圆点进行提示用户，这里需要加上分号。如果在js中定义一个数值，一个字符串，虽然这两个值相同，但是类型不同，一个数值型，另一个是字符串类型，所以要判断这两个变量是否相等就需要用到三等于了，但是如果我们不小心写少了一个等号的话，就很难察觉了，为了避免这种情况的发生，我们需要自定义校验，自定义校验的步骤如下：

定义一个名称为.jshintrc的配置文件，该文件里面的内容是json格式的，内容如下：

{

"eqeqeq":true,//校验三等的情况

"curly":true//校验if，for语法没有写花括号的情况

}

9.autofilename

自动提示文件路径 如：

待续...