Shelton

那些年我使用的Sublime Text3

工欲善其事,必先利其器!

起因

第一次使用Sublime Text2就被它那简洁轻量以及漂亮的配色所吸引,随着不断学习使用,写代码的效率也提高了。到后来Sublime Text3版本推出,初次安装就被那启动速度所征服。
下面就介绍下Sublime Text3。
软件下载地址:https://www.sublimetext.com/

关于Sublime Text

Sublime Text 是一个代码编辑器(Sublime Text 2是收费软件,但可以无限期试用),也是HTML和散文先进的文本编辑器。Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来,它最初被设计为一个具有丰富扩展功能的Vim。

Sublime Text具有漂亮的用户界面和强大的功能,例如代码缩略图,Python的插件,代码段等。还可自定义键绑定,菜单和工具栏。Sublime Text 的主要功能包括:拼写检查,书签,完整的 Python API , Goto 功能,即时项目切换,多选择,多窗口等等。Sublime Text 是一个跨平台的编辑器,同时支持Windows、Linux、Mac OS X等操作系统。

如何安装插件

  • 插件安装方式一:直接安装:

    安装Sublime text 3插件很方便,可以直接下载安装包解压缩到Packages目录(菜单-preferences-packages)。

  • 插件安装方式二:通过Package Control安装:

    打开Sublime Text3,按Ctrl + ` 或者通过View-Show Console,你会看到如下图:

然后把以下这段代码复制到箭头所指的位置,回车执行!
这段代码也可以去官网复制。

1
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)

安装完成后,重启Sublime Text3,如果能在Preferences - Package Settings 中看到 Package Control,就说明安装Package control成功。

PS:国内使用SublimeText3,经常可能遇到无法安装可用插件问题,可remove掉Package Control重新安装下;如果连Package Control也无法安装,可以网上找一份关于Package Control的文件-(Package Control.sublime-package)存放于Installed Packages目录之下即可。

完成packageControl的安装后,以后就可以进行插件的安装了:
1.选择Preferences中的Package Control 或者直接Ctrl+Shift+p打开安装插件的画面,如下图所示。

2.然后输入install,回车后,就能看到很多插件,如下图所示。

3.接下来你就可以愉快地安装喜欢的插件啦~

我使用中的插件

WordCount:用来实时显示当前文件的字数。

SideBarEnhancements:左边栏显示文件夹及文件,有很多选项可以选择。这个插件还有个强大的功能就是可以定义快捷键调出浏览器预览当前页面。设置如下:
安装此插件后,点击菜单栏的preferences - package setting - side bar - Key Building-User,然后把下面的代码复制Key Building-User保存即可。

1
2
3
4
5
6
7
8
9
10
11
[
{ "keys": ["ctrl+shift+c"], "command": "copy_path" },
//chrome
{ "keys": ["f2"], "command": "side_bar_files_open_with",
"args": {
"paths": [],
"application": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe",
"extensions":".*"
}
}
]

这里按ctrl+shift+c复制当前文件路径,按F2则是在Chrome浏览器显示当前页面,是不是觉得很强大呀。当然你也修改成自己喜欢的快捷键或者浏览器(FireFox,Safari,UC,IE等等),只要修改代码中相关参数即可!

SideBarFolders:用来管理左边栏文件夹。

BracketHighlighter:用来显示我在哪个括号中,写、看代码都很好用。

ConvertToUTF8:直接在菜单栏中转码,专为中文设计,妈妈再也不通担心中文乱码问题了。

SublimeTmpl:Sublime Text3一直都是没新建文件模板的(像DW新建hmtl文件模板),有了它,再也不用每次复制DTD声明这些了。而且模板在package下的templates,可以进行修改。快捷键如下:

ctrl + alt + h : html
ctrl + alt + j : javascript
ctrl + alt + c : css
ctrl + alt + p : php
ctrl + alt + shift + p : python
ctrl + alt + r : ruby

Monokai Extended: 如果你喜欢Monkai主题,可以再试试这个增强版的主题。

Emmet:这个插件可以说前端开发必不可少的,它让编写html代码更加简单高效。这里有张速查表可以快速帮你记忆编写规则,官方文档有更加详细的说明。
看下图你就知道了:

MarkdownEditing:用来写MarkDown的利器,支持GFM(Github Favored Markdown),并且自带3个主题,不过我自己还是更倾向于Monokai Theme,如何你也想设置Monokai,就在Preferences - Package Settings - Markdown Editing - Markdown GFM Settings - User中添加以下代码即可(前提是你安装了Monokai Extended),你也可设置为自己的个性主题:

1
2
3
{
"color_scheme": "Packages/Monokai Extended/Monokai Extended.tmTheme"
}

MarkdownPreview:有了写Markdowm的环境,当然还需要预览啦,按ctrl+b生成网页HTML。

OmniMarkupPreviwer:实时在浏览器中预览,而MarkdownPreview是需要手动生成的和F5的,如果你有两个屏幕用这个插件再适合不过了,一边编辑Markdowm,一边查看效果。
快捷键如下:

  • ctrl+alt+o : Preview Markup in Browser
  • ctrl+alt+x : Export Markup as HTML
  • ctrl+alt+c : Copy Markup as HTML

最后

关于更多的Sublime Text内容,请看牛人总结的Sublime Text的心得经验:https://github.com/jikeytang/sublime-text
个人觉得非常受用,同样希望能够帮到你。