前台研发工具Sublime

沟通交流群 【极客Online : 546653637】　　欢迎您！

今天一个朋友@我，问有没有好的IDE推荐一下，其实现在有很多文本工具可供选择，像Nodepad++、Editplus之类的，之前我使用Editplus比较多，用了很多年，可能也是习惯了。

后来还用过一段时间的WebStorm，感觉也很不错，再后来就是使用Sublime，喜欢这个工具的原因主要是干净、轻量级、右侧缩略图，还有就是丰富的插件等。

简单的做一下介绍，包括安装、基本配置，还有几个 个人感觉必须的插件：

一.下载安装：

　　下载地址：http://www.sublimetext.com/3

　　根据你的平台（OS、windows还是Ubuntu），分x64和x86的，仔细看看，下载安装还是很简单的。

二.基本配置

　　Sublime有很多插件，安装和管理这些插件的必备神器：Package Control [地址：https://packagecontrol.io/installation]

　　这个是必须要安装的，安装方式：

　　打开Sublime，通过Menu->View->Show Console打开控制台（或快捷键Ctrl+`)，如下图：

　　

　　根据自己的版本，选择下面的内容，直接粘贴在图中所示的位置，然后回车即可（稍等以后，就可以安装完成了）：

>> Sublime Text 2 :

import urllib2,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; 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()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')

　　

>>Sublime Text 3:　　

import urllib.request,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

三. 安装插件

如果以上的步骤都成功了， 那接下来安装插件就很简单了。

通过Menu->Preferences->Package Control，打开Package Control管理器（或者快捷键：Ctrl+Shift+P）,输入"IP"，如下图：

选择第一个“Package Control:Install Package”，如下图：

在输入框内输入你想要搜索的插件名称，然后点击安装就可以了，如安装Html5插件，可以输入Html，下面会自动显示Html5，选择一个你想要的，就可以安装了。

四.几个小插件

EMMET：

　　你应该早就听说过Zen Coding，没错，就是这个东西，能帮助你快速的构建模板和编写html、js、css代码，比如你打开一个空白页，然后输入：html:5，直接Tab，会自动生成Html5格式的HTML页面模板。

ConvertToUTF8：

　　如果不安装这个，有时候显示的中文会是乱码，所以也是必须要安装的

autofilename:

　　文件路径引导插件

AllAutocomplete:

　　自动补全（在全部文档搜索）

SublimeCodeIntel：

　　关键字自动补全插件

DocBlockr：

　　添加注释助手插件

其他的插件，还有很多，看个人需求，就不一一介绍了。

可以百度一下，或者看看这几个地方（有挺多是重复的）：

http://www.php100.com/html/it/focus/2014/1128/7935.html

http://www.oschina.net/translate/20-powerful-sublimetext-plugins