前端神器Sublime Text 2基础入门

开始sublime text

之前我一直在用editplus写js，不是说editplus不好用，只是有些功能真的不是特别友好，所以从今之后改稍微强大一点的sublime text，最新版本貌似已经到3了，这确实很棒，可也很贵，70$对美国人没什么，但对中国的一个普通程序猿就有点相形见绌了。

下载及破解

并不推荐大家一定要用最新版，也会有一些极客因为执着而非得用3，这里我提供两个地址供大家选择

• Sublime Text 3 官方主页

• Sublime Text 2 官方主页

你可以下载适合你电脑系统的版本，这真的很棒！！！

• Sublime Text 3 注册机

• Sublime Text 3 中文语言包

① 注册机

打开注册机，点击Generate破解主文件，复制License中的内容，比如

1
2
3
4
5
6
7
8
9
10
11
12
13

-----BEGIN LICENSE-----
Mr. White
Unlimited User License
EA7E-31845
CF502875803A7265F0F83FA6731619B2
42DB6024BF085A26B4E6BBA79A109CBD
182A0C996874E7DF78537CF74E4EB596
E85AC9A8CD0248A872DE6579413DD9FF
77741FF482DF6925B627356EDFC6BD02
38C03F082A2ED8D79BC00536C8DE83C4
3AC650A7998B247673F109224259E0FF
BF830166E43BBB29F9D97383D210604A
-----END LICENSE-----

这里必须把begin license到end license都得选中复制，然后点击patch key选中sublime_text.exe，打开Sublime Text，执行 Help->Enter license 粘贴你的License，点击OK，重启Sublime Text即可看到你的注册信息。

② 汉化

运行Sublime Text 2 点击 Preferneces -> Browse Packages 会打开 X:\Program Files\Sublime Text\Data\Packages 目录，点击向上并找到X:\Program Files\Sublime Text\Data\Installed Packages目录，从附件中下载汉化包并解压，复制Default.sublime-package到这个目录，无需重启即可直接看到汉化效果。

配置

在菜单 Preferences 下找到 File Settings – User 点击会打开Base File.sublime-settings这个文件

将其中的 font_face 后修改添加想要的设置字体（如果没有font_face自行添加这一行注意英文”,”逗号隔开），设置代码片段示例如下：

1
2
3
4
5
6

{
  "color_scheme": "Packages/Color Scheme - Default/Monokai.tmTheme",
  "font_face": "YaHei Consolas Hybrid",
  "font_size": 12.5,
  "theme": "Soda Light.sublime-theme"
}

快捷键和插件

① 安装包控制（Package Control）

打开Sublime Text 2，按快捷键 ctrl+ 或者点击Tools → Command Palette` 调出控制台Console

将以下代码复制粘贴进命令行后回车：

1

import urllib2,os; pf='Package Control.sublime-package'; ipp=sublime.installed_packages_path(); os.makedirs(ipp) if not os.path.exists(ipp) else None; urllib2.install_opener(urllib2.build_opener(urllib2.ProxyHandler())); open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read()); print 'Please restart Sublime Text to finish installation'  

重新启动Sublime Text 2，如果在Preferences → Package Settings 中看到 Package Control 这一项，就说明安装成功了。

② 安装Alignment插件

对于喜欢整齐的玛民来说，这不失为一个省事的插件。该插件可以通过上面安装好的 Package Control 来安装：

按ctrl + shift + P调出命令面板；

输入 install 调出 Package Control：Install Package 选项，并回车；

输入Alignment，选中并按回车安装；

重启Sublime Text 2，选中文本并按ctrl + alt + a 就可以进行对齐操作了。

③ 安装 Soda 主题

这里的主题不同于针对代码的 color scheme，而是针对Sublime Text 2该软件本身的主题，该主题也可以通过万能的 Package Control 来安装。

按ctrl + shift + P调出命令面板；

输入 install 调出 Package Control：Install Package 选项，并回车；

输入 theme soda 选中后回车即可安装；

安装完之后要激活主题，打开 Preferences → Global Settings – User，加上以下代码保存即可生效：

1

"theme": "Soda Light.sublime-theme"　或者　"theme" : "Soda Dark.sublime-theme"

④ 安装cTags插件

首先，从Ctags官网下载压缩包下来，解压到电脑的某个地方，比如C:\Program Files\ctags，然后把cTags添加到系统变量里去：

在我的电脑 右键属性 → 高级 → 环境变量 → 在“系统变量”里找到“Path”，点击“编辑” → 把C:\Program Files\ctags”（不包括双引号）复制到最后 → 最后一路“确定”保存。

然后通过 Package Control 来安装 cTags 插件：

按ctrl + shift + P调出命令面板；

输入 install 调出 Package Control：Install Package 选项，并回车；

输入 ctags 选中后回车即可安装。

安装完之后，在项目的当前目录下按ctrl + t, ctrl + r，会生成.tags的文件。当光标停留在某个函数上时，按快捷键 ctrl+t, ctrl+t就可以打开函数所在的文件，并跳转到相应的位置了。

PS：安装这个插件折腾了我蛮久，主要是不知道还要从ctags官网下载压缩包，以及修改系统的变量，后来还是一博友给我发的国外的参考资料才知道要这样配置的。刚开始知道这软件之所以没用是因为没有像eclipse可以追踪函数的功能，后来才知道可以通过安装cTags插件来实现。装上此功能后，就更喜欢用Sublime Text 2了。

⑤ jsFormat插件

格式化js：选中一段文本，control+alt+f。

⑥ DocBlockr

在JS函数上方输入/**，然后回车，doc就生成好了非常好用。

⑦ sublime-jslint

打开一个js文件，control+j，即可输出jsLint检查的结果。打开Packages目录，找到插件目录sublime-jslint，打开sublime-jslint.sublime-settings文件，可以修改jsLint配置，还可以配置文件保存时自动检查等，如：

1
2
3
4
5
6
7
8
9

{ 
// Path to the jslint jar. 
// Leave blank to use bundled jar. "jslint_jar": "",   
// Options pass to jslint. 
// Jerry Qu注：全部可用配置参考这里，https://github.com/fbzhong/sublime-jslint/wiki/Available-jslint4java-options "jslint_options": "--encoding utf-8 --bitwise --browser --cap --css --devel --debug --evil --forin --fragment --on --sub --white --windows --sloppy",   
// Ignore errors, regex. "ignore_errors": [ // "Expected an identifier and instead saw 'undefined' \(a reserved word\)" ],   
// run jslint on save. "run_on_save": false,   
// debug flag. "debug": false 
}

⑧ SideBarEnhancements 推荐通过 Package Control 安装 SideBarEnhancements 这个插件，可以大大加强在侧栏目录树中右键的选项

⑨ Zen Coding

⑩ jQuery Package for sublime Text

⑪ Clipboard History

⑫ Bracket Highlighter

⑬ GBK to UTF8

⑭ Git

⑮ JsMinifier