Sublime Text 2

最近工作需要在iOS上跑一點Javascript，缺少一個好用的IDE實在痛苦。這時候就會覺得不管是XCode、eclipse還是VisualStudio都真是偉大！還好最近發現了新editor，調校之後一切終於順手多了。

Sublime Text 官網

幾個寫code用editor必備的功能如: Syntax Highlight、Bookmark、Bracket Match... 是一定都有的。它比較特別的地方是，提供了plugin的API，大家就可以依照需求自由開發一些plugin來使用。加上plugin之後，整個就變得很豐富了。

底下介紹幾個這兩天發現的好用功能、快速鍵以及plugin。

0. 設定檔以及package installer
1. 兩欄顯示。
2. vi mode
2.1 block cursor
2.2 開啟檔案預設為command mode(7/10 新增)
3. bracket highlight
4. 標示尚未儲存的修改
5. Sublime Linter
6. 多游標同時編輯 

0. 第一次打開它的Preference著實驚了一下。直接用文字設定檔，整個也太...Geek(?)了一點。不過也是啦，反正會用這個editor的人，多半也很習慣寫code了。整個用"code"設定也很理所當然。
如同前面所說，它提供了非常豐富的plugin資源，安裝上也非常方便。所以第一件事就是：先把Package Installer安裝起來。安裝方法十分"簡單"，用Ctrl+`打開command line，然後把底下這段貼進去就可以啦。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'它還提供了更複雜的安裝方式，詳細可以參考這裡。

安裝完package installer之後，用vi mode的command就可以很輕鬆叫出package manager囉！

1. 在看code的時候常常需要參考多個檔案，更常需要兩相對照。所以如果可以把檔案開成左右兩邊就非常方便了。從 View>Layout>Columns:2 或用快速鍵 cmd+option+2 可以切換成底下這樣。

更方便的是，同一個檔案也可以同時出現在左右兩邊喔！File>New View into File

2. 用慣vi的人一定會愛這個mode。我平常慣用的一些command基本上都有支援。
設定的方式是，在Preferences>Settings - User中，加入底下這行。
"ignored_packages" : [""],
它的設定方式基本上就是編寫這個檔案。更多設定可以從Preferences>Settings - Default copy過來再改。當然直接改在Default裡面也是可以作用的啦，就看各人喜好囉。

(目前為止vi mode只有發現一個問題，就是'3dd'的這種數字command是可以正常運作的，不過唯獨'3=='只會作用在目前這行。不過在我把Edit>Line>Reindent設成快速鍵之後也就無傷大雅了。)

2.1 如果你用慣vim，那你可能也跟我一樣習慣它的游標在command mode的時候是block，insert mode的時候是under line。那你就可以裝這個plugin。SublimeBlockCursor。

安裝完之後馬上就可以看到效果了。後續其他plugin也都是一樣的安裝方法。

2.2 這就只需要一行設定而已了"vintage_start_in_command_mode": true

3. bracket highlight這個plugin提供很完整的括號對應的功能，還可以在旁邊顯示小標籤。詳細介紹可以參看官網。看！有多麼花俏！

這邊安裝不是重點，重點是設定。設定部分從Preferences>PackageSettings>BracketHighlighter裡面可以設定。

主要我用到的有幾個，不過懶得解釋了就直接把我的設定貼在底下給各位參考。{
// Match brackets only when cursor is between the brackets
"match_brackets_only_when_between": true,

// Scope? (Defined in theme files.)
// Examples: (keyword|string|number)
"quote_scope" : "bracket.quote",
"curly_scope" : "bracket.curly",
"round_scope" : "bracket.round",
"square_scope": "bracket.square",
"angle_scope" : "bracket.angle",
"tag_scope" : "bracket.tag",

// Icon? (dot|circle|bookmark|quote|curly_bracket|round_bracket|square_bracket|angle_bracket|none)
"quote_icon" : "dot",
"curly_icon" : "dot",
"round_icon" : "dot",
"square_icon": "dot",
"angle_icon" : "angle_bracket",
"tag_icon" : "angle_bracket",

// Outline? (solid|outline|underline|none)
"quote_style" : "underline",
"curly_style" : "outline",
"round_style" : "underline",
"square_style": "underline",
"angle_style" : "outline",
"tag_style" : "outline"
}如果需要改顏色的話，官網上面也有說明。基本上就是把那些xml貼進慣用的theme裡面。這邊就不再重複啦。

4. 標示尚未儲存的修改這點，記得好像是eclipse的功能(？)這邊也有plugin可以使用。Change Tracker。我本來是用這個plugin，不過用用好像有點buggy & lag，所以後來用別人在論壇上貼的code，簡單快速！

具體的作法是，Tools>New Plugin，開一個新的plugin檔案，把底下這段code貼進去。import sublime, sublime_plugin

class ClearChangesCommand(sublime_plugin.EventListener):
def on_post_save(self, view):
view.erase_regions('unsaved')

class HighlightUnsavedCommand(sublime_plugin.EventListener):
def on_modified(self, view):
unsaved = view.get_regions('unsaved') + [view.line(s) for s in view.sel()]
view.add_regions("unsaved", unsaved, "unsaved", "dot", sublime.HIDDEN | sublime.PERSISTENT)存檔之後就可以囉！參考出處
修改過的地方旁邊就會出現像底下這樣的小白點。

5. 最後一個Sublime Linter可以幫忙檢查一些語法錯誤，再highlight起來。對我這種javascript新手來說， 真是幫了一個大忙。

6. 多游標同時編輯的功能我剛看到感覺還蠻妙的。不過實際用起來還真的方便。用法也很簡單，按著command再用滑鼠點其他地方就可以囉！


Sublime Text 2真是一個非常強大的editor，而且還跨了Windows、Mac以及Linux三大平台。雖然它單一license的要價並不便宜，但他也提供了無期限的trial供大家試用，就只是偶爾會彈出popup請購買而已。算是非常佛心的了。

網路上還有不少專文介紹，這邊單就幾個我自己有在使用功能介紹給大家。更多厲害的plugin就等各位去發掘囉！