Step 1:从官网下载软件
Sublime Text 官网下载
选择适用于自己当前操作平台的 Sublime Text 的最新的稳定版本进行下载。
Step 2:学习常用的快捷键
官网 上的6张动图很好的解释了 ST 最常用也最实用的6个快捷键:
Use Multiple Selections to rename variables quickly.
HereCtrl+D
is used to select the next occurrence of the current word.
使用多选来同时重命名多处变量。
Ctrl+D
可用来选择当前所选内容的下一处出现位置,Alt+F3
可一次性将所有与当前所选内容一致的地方选择到,进行批量修改。Make batch edits with Multiple Selections.
Here Ctrl+Shift+L is used to split a selection into lines, and each line is then edited simultaneously.
使用多选来进行批量编辑。
Ctrl+Shift+L
用来将所选区域按行区分,每行末尾都会出现光标,可同时进行编辑。The Command Palette gives fast access to functionality.
Here Ctrl+Shift+P is used to show the Command Palette, "sspy" (short for Set Syntax: Python) is used set the syntax of the current file to Python.
通过命令面板可以快速使用各种功能。
Ctrl+Shift+P
是打开命令面板的快捷键,"sspy"(Set Syntax: Python 的缩写)用来将当前文件的语法设置为 Python。Use Goto Anything to quickly navigate between files, even in the largest projects.
Ctrl+P shows Goto Anything, and typing then filters on file and directory names.
使用 Goto Anything 来快速在不同文件中切换,即使是在最大的项目中。
Ctrl+P
打开 Goto Anything 输入框,然后进行输入将会实时筛选文件名和文件夹名。Goto Anything can also be used to show a function, line or word within a file.
Type @ after a file name to filter on symbols.
Goto Anything 同时也可以寻找一个文件中的某个方法,某一行或者某个词。
在文件名后面输入 @ 来进一步筛选文件中的具体标记。Find and Replace with regular expressions.
Here unwanted whitespace is removed by using the regex " +" to find groups of spaces, which are then selected simultaneously with the Find All button.
使用正则表达式来进行寻找和替换。
使用正则“ +”(空格和+号)来找到连续的空格,然后使用Find All
按钮来找到所有符合条件的地方。
更多常用的值得学习的快捷键请参考这篇文章:Gif多图:常用的 16 个 Sublime Text 快捷键
Step 3:安装实用的插件
- Package Control
Package Control:
The Sublime Text package manager that makes it exceedingly simple to find, install and keep packages up-to-date.
Package Control 可以使我们轻松的在 ST(Sublime Text)上安装插件,并且保持插件为最新版本。
- Emmet
Emmet 的前身是大名鼎鼎的 Zen coding。它使用仿 CSS 选择器的语法来生成代码,按下 Tab 键,Emmet 就能把一个缩写展开成一个 HTML 和 CSS 代码块,大大提高了 HTML/CSS 代码编写的速度。
想要更好的领略 Emmet 的魅力,可以到官网查看 Demo 演示。
下载方式:
- 点击 Emmet 官网页面下方的 Download
- 在新的页面中选择 Sublime Text(针对这个编辑器的插件)
- Github 页面中的 How
To Install 会告诉你有两种安装方式:使用 Package Control 或者是 Manually(手动) - 这时候你的 ST 中还没有 Package Control,你就点击 With Package Control 上的链接
- 通过链接你来到了 Package Control的官网,点击 Install Now
- 根据你安装的 ST 版本选择代码片段并复制
- 在 ST 里,View > Show Console,将复制的代码片段粘贴到打开的 Console 中,回车,等一会儿 Package Control 就安装好了!
- 在 ST 里,选择 Preferences > Package Control,点击 “Package Control: Install Package”, 然后输入 Emmet,选择并安装。
- Bingo!分分钟安装完毕!
PS:找到各自的官网,根据提示安装,条条大路通罗马,以上只是我当初安装的方式,不是唯一的方式。
插件使用方式:
Package Control:
就像安装 Emmet 时的操作一样,选择 “Package Control: Install Package”,然后输入想要安装的插件,找到后点击安装就好啦!
Emmet:
建议先将官网上浅显易懂的使用方式学会(简单的先用着,熟悉一下),然后再深入学习,提高编码效率。
- BracketHighlighter
成对匹配的增强。
像这些符号是成对的:花括号 { }, 中括号 [ ],括号 ( ), 引号 “ ” 等。 对于这些符号,当我们鼠标放在开始符号的位置的时候,希望能明显看到结尾符号在哪儿,sublime 中对于结尾符号默认是显示下划线,很不明显,这个插件可以在行号左侧显示匹配的符号位置,很有帮助。
- AllAutocomplete
传统的 Sublime Text 自动补全插件仅仅在当前文件下工作。AllAutocomplete 针对补全可以搜索全部打开的标签页,这将极大的简化开发进程。
- SublimeCodeIntel
SublimeCodeIntel:A full-featured code intelligence and smart autocomplete engine for Sublime Text.
实现了一些 IDE 的功能并且为一些语言提供了“代码情报”: JavaScript, Mason, XBL, XUL, RHTML, SCSS, Python, HTML, Ruby, Python3, XML, Sass, XSLT, Django, HTML5, Perl, CSS, Twig, Less, Smarty, Node.js, Tcl, TemplateToolkit, PHP.
- AutoFileName
自动补全文件路径,非常方便实用。
- Color Highlighter
颜色高亮,将代码所代表的颜色以相应的颜色高亮出来,便于寻找和判断颜色代码的位置。
- HTML/CSS/JS Prettify
这是一款集成了格式化(美化)html、css、js 三种文件类型的插件。插件依赖于 nodejs,因此需要事先安装 nodejs,然后才可以正常运行。nodejs 只要到官网下载,然后保存地址选择默认的就可以了。
强烈推荐这款插件,有时候任性的写了一段代码或者复制粘贴别处的代码段后,丑陋的代码排版让人无法忍受,但是手动调整又费时间,使用这个插件就可以轻松将代码的排版美化,令人心情愉悦。
小结
插件的具体用法等不懂的可以查阅相关资料,可以从官网的说明开始查起,那里总是会有最佳实践,不怕错过插件最令人赞叹的功能。
Sublime Text 还有很多有助于提高开发效率的快捷键,插件,功能等,等上手了就可以进一步探索了!当你遇到重复性的代码工作时,就可以考虑去搜索是否有相关的插件可供使用,往往会发现惊喜哦。