sublime是一款具有漂亮的用户界面和强大的功能且小巧高速的代码编辑器。它最大的特点就是可以根据自己的需求下载需要的插件,自定义一款适合自己编码习惯的编辑器。
安装Package Control
安装插件之前需要先安装Package Control。按【Ctrl+`】调出console(或点击菜单栏view->showConsole),粘贴安装代码到底部命令行并回车:重启Sublime Text 2。如果在Perferences->package settings中看到package control这一项,则安装成功。
用Package Control安装其他插件
按下Ctrl+Shift+P调出命令面板,输入install 调出 Install Package 选项并回车,然后在列表中选中要安装的插件。
常用插件如下:
Emmet
emmet是一种快速的html、css编写方式。默认用tab键、'ctrl+E'。直接在html代码中或者通过ctrl+alt+enter弹出代码框,写入类似以下格式的代码(ul>.item{content}$*10)(> 号生成子元素 ,$ 产生序号,{ }产生内容),点击'ctrl+E'或tab键会自动生成html代码。
JS Format
一个JS代码格式化插件。默认ctrl+alt+f
sublimelinter+sublimelinter-jshint+npw install -g jshint
使用lint进行语法及风格校验jshint可以统一编码风格。
安装jshint的步骤:
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。
如何在js中使用校验呢?步骤如下:
ctrl+alt+n打开一个新文件--->切换到js语法模式--->如果用户在js文件上写上var x=123后面却没有分号的话,那么该行的左边就会有个黄色的圆点进行提示用户,这里需要加上分号。如果在js中定义一个数值,一个字符串,虽然这两个值相同,但是类型不同,一个数值型,另一个是字符串类型,所以要判断这两个变量是否相等就需要用到三等于了,但是如果我们不小心写少了一个等号的话,就很难察觉了,为了避免这种情况的发生,我们需要自定义校验,自定义校验的步骤如下:定义一个名称为.jshintrc的配置文件,该文件里面的内容是json格式的,内容如下:
{
“eqeqeq”: true, //校验三等的情况
"curly": true//校验if,for语法没有写花括号的情况
}
安装advanceNewfile插件,快捷键Ctrl+Alt+N,可以直接创建路径及里面的文件
snippets
snippets有很多,根据需要选择自己常用的
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
常用快捷键及使用技巧
ctrl+shift+v : 粘贴时保持缩进
Ctrl+H :查找替换
Ctrl+D :选择游标所在单词,连续Ctrl+D 实现多行选择(选择与第一次选择相同的单词)
Ctrl+K Ctrl+D 跳过当前选择,选择下一个
Ctrl+shirt+D:复制游标所在行
Alt+F3:选择所有与游标所在单词相同的单词
按住shift键,然后按住鼠标右键向下拖动,也可产生多行游标
ctrl+shift+P(1)输入:js 选set:syntax
快速设置文本语法(2)输入:minimap,选择view:toggle minimap可以切换缩略图的显示。
ctrl+p输入:goto anything ;如:@body 可快速找到css选择器、直接模糊查找文件
ctrl+shirt+enter: 在当前上方添加一行
ctrl+enter: 在当前下方添加一行
Ctrl+]:增加缩进
Ctrl+[:减小缩进
Alt+Shift+1~9:(非小键盘)屏幕显示相等数字的小窗口
Alt+数字:切换打开第N个文件
Ctrl+Tab:按文件浏览过的顺序,切换当前窗口的标签页。