打造属于自己的前端开发神器 -- 给Sublime Text加上Eclipse的光环

来自[豆瓣 http://www.douban.com/note/276794943/]

将Sublime Text打造成如Eclipse一般的前端开发IDE

1. 快捷键移植篇
从Java开始的梦, 到如痴如醉的Front End, 却始终摆脱不了Eclipse的束缚.
对于Javaer, Eclipse是非常不错的选择, 但对于单纯的前端而言, 是不是觉得略显笨重, 其中各种不想要的东西, 反正是诸多不爽, 曾用过Eclipse来做前端的人应该都有同感.

羡慕别人使用VIM时的酣畅淋漓, 无赖门槛颇高, 上手几天后在Eclipse的"熏陶"下又渐渐淡忘了.

当遇见Sublime Text后, 这一切都改变了, 它简直就是易用版的VIM却不失VIM的神力, 也有非常丰富的插件. 我毅然决然的选择了"抛弃"Eclipse, 投身到它的怀抱.

但用上Sublime Text后, 发现其中各种快捷键和Eclipse不一样, 苦于Eclipse的习惯时常让我记忆混乱.
为了延续Eclipse多年的使用习惯, DRY, 我决定将Eclipse中的常用快捷键适配到Sublime Text. 当我的调整完成后, 发现下面这位仁兄早就有了这个想法[Eclipse shortcuts for Sublime Text 2 http://icoloma.blogspot.com/2011/10/eclipse-shortcuts-for-sublime-text-2.html], 但是不够完整, 现在有我这份就完美了.

适配的Eclipse快捷键如下
1) alt+/ 自动补全
2) ctrl+i 重新缩进
3) alt+up / alt+down 上下行交换位置
4) ctrl+alt+up / ctrl+alt+down 复制当前行到上/下一行
5) ctrl+d 删除整行
6) ctrl+l 光标移动到指定行
7) ctrl+k 快速定位到选中的文字
8) ctrl+shift+x / ctrl+shift+y 转换大/小写
9) shift+enter 在当前行的下一行插入空行(这时鼠标可以在当前行的任一位置, 不一定是最后)
10) ctrl+shift+p 定位到对于的匹配符(譬如{})
11) ctrl+o outline
12) ctrl+shift+r open resource
13) ctrl+f 文件内查找/替换
14) ctrl+h 全局查找/替换, 在查询结果中双击跳转到匹配位置

调整的快捷键和插件快捷键
1) ctrl+v 粘帖并缩进
2) ctrl+shift+v 粘帖
3) ctrl+alt+o 当前文件中的关键字(方便快速查找内容)
4) ctrl+p 打开Sublime Text的命令面板, 这个命令默认使用的是ctrl+shift+p
5) alt+a 按等号或冒号对齐(需要alignment插件)
6) ctrl+shift+f 格式化JavaScript代码(需要JsFormat插件)

实用Sublime Text快捷键
1) ctrl+left / ctrl+shift+left / alt+left / alt+shift+right光标一个单词一个单词的移动
2) ctrl+] / ctrl+[ 缩进
3) ctrl+backspace / ctrl+delete 删除整个单词
4) f9 行排序(例如选中几个JSON字段, 让这些字段名按字母顺序排序)

2. 推荐插件篇
如果没有各种插件的协助, Sublime Text绝对还是Text, 而非IDE, 就和Eclipse一样, 都是靠插件发展壮大的.
1) Package Control 必装, 一旦装了这个, 你就会发现安装/卸载插件如此简单
2) AutoFileName
3) BracketHighlighter
4) ColorHighlighter
5) DocBlockr
6) Emmet (ex-Zen Coding)
7) SideBarEnhancements

更多插件请参考[Sublime Text Packages http://wbond.net/sublime_packages/community#sort-installs]

完整配置文件
-----------
[快捷键映射(keymap) https://gist.github.com/ufologist/5590481#file-default-windows-sublime-keymap]
[Sublime Text编辑器配置 https://gist.github.com/ufologist/5590481#file-preferences-sublime-settings]
[安装的插件列表 https://gist.github.com/ufologist/5590481#file-package-control-sublime-settings]
[Alignment插件配置 https://gist.github.com/ufologist/5590481#file-base-file-sublime-settings]

参考
-----------
[Using Sublime Text as your IDE http://www.chromium.org/developers/sublime-text]
[Web Development With Sublime Text 2 http://www.paulund.co.uk/web-development-with-sublime-text-2]