最近項目正好有機會學(xué)h5，經(jīng)推薦使用sublime text3編寫代碼摇锋。

前言

代碼編輯器或者文本編輯器知牌，對于程序員來說祈争，就像劍與戰(zhàn)士一樣，誰都想擁有一把可以隨心駕馭且鋒利無比的寶劍角寸，而每一位程序員菩混，同樣會去追求最適合自己的強大、靈活的編輯器扁藕，相信你和我一樣沮峡，都不會例外。

如果說“神器”是我能給予一款軟件最高的評價亿柑，那么我很樂意為它封上這么一個稱號邢疙。sublime text （以下簡稱ST）小巧綠色且速度非常快，跨平臺支持Win/Mac/Linux疟游，支持32與64位呼畸，支持各種流行編程語言的語法高亮、代碼補全等颁虐，但ST2有著很多其他編輯器沒有的超酷的特性蛮原，讓它的好用達到了前所未有的程度……

ST不是免費的，但可以永久免費使用另绩，只是在保存的時候儒陨，偶爾會彈出要你購買注冊的對話框，僅此而已板熊。軟件官網(wǎng)下載地址：http://www.sublimetext.com/2框全。去下載試試吧~

最近一直在使用ST，因為DW太臃腫干签，而ST編寫代碼速度很快很輕便~

優(yōu)點

SublimeText2 支持但不限于 C, C++, C#, CSS, D, Erlang, HTML, Groovy,

Haskell, HTML, Java, JavaScript, LaTeX, Lisp, Lua, Markdown, Matlab,

OCaml, Perl, PHP, Python, R, Ruby, SQL, TCL, Textile and XML

等主流編程語言的語法高亮津辩。ST2 擁有優(yōu)秀的代碼自動完成功能

(自動補齊括號，大括號等配對符號容劳；自動補全已經(jīng)出現(xiàn)的單詞喘沿；自動補全函數(shù)名)，非常智能竭贩；另外 ST2

也擁有代碼片段（Snippet）的功能蚜印，可以將常用的代碼片段保存起來，在需要時隨時調(diào)用留量。

強大的多行選擇和多行編輯

代碼地圖窄赋、多種界面布局與全屏免打擾模式

快捷鍵

強大的快捷鍵，提高你的編碼效率楼熄。

常用快捷鍵

CTRL+N：新建文件

CTRL+w：關(guān)閉文件

CTRL+O：打開文件

CTRL+Z：撤銷

CTRL+Y：撤銷還原

CTRL+F：查找

CTRL+H：替換

Esc：小工具窗口隱藏

編碼快捷鍵

Ctrl+Shift+P 打開命令面板忆绰，如設(shè)置編碼語言

Tab：縮進、自動完成

Shift+Tab 去除縮進

Ctrl+J 合并行（已選擇需要合并的多行時）

Ctrl+T 詞互換

Ctrl+U 軟撤銷

Ctrl+K Backspace 從光標(biāo)處刪除至行首

Ctrl+KK 從光標(biāo)處刪除至行尾

Ctrl+K+T 折疊屬性

Ctrl+K+U 改為大寫

Ctrl+K+L 改為小寫

Ctrl+K+0 展開所有

Ctrl+Enter 插入行后（快速換行）

Ctrl+Shift+/ 注釋已選擇內(nèi)容

Ctrl+Shift+↑可以移動此行代碼可岂，與上行互換

Ctrl+Shift+↓可以移動此行代碼错敢，與下行互換

Ctrl+Shift+[ 折疊代碼

Ctrl+Shift+] 展開代碼

Ctrl+/ 注釋整行（如已選擇內(nèi)容，同“Ctrl+Shift+/”效果）

Ctrl+Shift+A 選擇光標(biāo)位置父標(biāo)簽對兒

Ctrl+Shift+D 復(fù)制光標(biāo)所在整行缕粹，插入在該行之前

Ctrl+Shift+K 刪除整行

Ctrl+Shift+L 鼠標(biāo)選中多行（按下快捷鍵）稚茅，即可同時編輯這些行

Ctrl+Shift+M 選擇括號內(nèi)的內(nèi)容（按住-繼續(xù)選擇父括號）

Ctrl+Shift+Enter 光標(biāo)前插入行

Ctrl+PageDown 、Ctrl+PageUp 文件按開啟的前后順序切換

Ctrl+鼠標(biāo)左鍵 可以同時選擇要編輯的多處文本

Shift+鼠標(biāo)右鍵（或使用鼠標(biāo)中鍵）可以用鼠標(biāo)進行豎向多行選擇

查找快捷鍵

CTRL+P：查找當(dāng)前項目中的文件和快速搜索平斩，快速查找標(biāo)簽位置

Ctrl+P輸入 @ 查找文件主標(biāo)題/函數(shù)亚享；或輸入：跳轉(zhuǎn)到文件某行

CTRL+G：跳轉(zhuǎn)到指定行

CTRL+F：查找

Ctrl+D 選詞 （反復(fù)按快捷鍵，即可繼續(xù)向下同時選中下一個相同的文本進行同時編輯）

Ctrl+L 選擇整行（按住-繼續(xù)選擇下行）

Ctrl+M 光標(biāo)移動至括號內(nèi)開始或結(jié)束的位置

Ctrl+R 快速列出/跳轉(zhuǎn)到某個函數(shù)

ctrl+shift+F 在文件夾內(nèi)查找绘面，與普通編輯器不同的地方是sublime允許添加多個文件夾進行查找

其他快捷鍵

Ctrl+K+B 開啟/關(guān)閉側(cè)邊欄

Ctrl+Tab 當(dāng)前窗口中的標(biāo)簽頁切換

Ctrl+F2 設(shè)置書簽

Shift+F2 上一個書簽

Alt+Shift+1（非小鍵盤）窗口分屏虹蒋，恢復(fù)默認(rèn)1屏

Alt+Shift+2 左右分屏-2列

Alt+Shift+3 左右分屏-3列

Alt+Shift+4 左右分屏-4列

Alt+Shift+5 等分4屏

Alt+Shift+8 垂直分屏-2屏

Alt+Shift+9 垂直分屏-3屏

Alt+. 閉合當(dāng)前標(biāo)簽

Alt+F3 選中文本按下快捷鍵糜芳，即可一次性選擇全部的相同文本進行同時編輯

Tab 縮進 自動完成

F2 下一個書簽

F6 檢測語法錯誤

F9 行排序(按a-z)

F11 全屏模式

安裝插件準(zhǔn)備步驟

1.先裝一個管理插件的插件，必備：package control

1.按Ctrl+`調(diào)出console

2.在底部代碼行貼上以下代碼并回車：

importurllib2,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();os.makedirs(ipp)ifnotos.path.exists(ipp)elseNone;open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read())

3.重啟sublimetext魄衅，如果在Perferences->packagesettings中看到packagecontrol這一項，則安裝成功塘辅。

2.點擊Preferences→Package Control晃虫，顯示以下彈窗：

DisablePackage：禁用插件

enablePackage：啟用插件

InstallPackage：安裝插件

ListPackage：查看已安裝插件列表

RemovePackage：移除插件

UpgradePackage：升級插件

3.安裝插件

Preferences→Package Control→Install Package，輸入插件名稱扣墩，會看到編輯器的底部在loading下載安裝中哲银，安裝完后，一般重啟即可呻惕。

插件及功能推薦

編碼快捷鍵荆责，前端必備-Emmet

Emmet作為zen coding的升級版，對于前端來說亚脆，可是必備插件做院，如果你對它還不太熟悉，可以在其官網(wǎng)（http://docs.emmet.io/）上看下具體的視頻教程濒持〖或者是也可以再這里看http://docs.emmet.io/cheat-sheet/

舉例：ul#nav>li.item$*4>a{Item $} ?然后Tab鍵

顯示結(jié)果是

有夠快么？還有更多例子柑营，請看http://docs.emmet.io/abbreviations/syntax/

快捷輸出dtd頭文件屈雄，即HTML頭部信息

在沒裝emmet插件的情況下，如果輸入html官套，顯示的僅是簡單的html結(jié)構(gòu)酒奶，不包含dtd頭文件，這讓人很郁悶奶赔。不過以下的解決方法挺不錯惋嚎，支持多種頭文件，html5的寫法也支持哦~

在裝了emmet插件之后纺阔，可以使用html:4t瘸彤、html:4s、html:xt笛钝、html:xs质况、html:xxs、html:5等6中dtd設(shè)置中的一種玻靡，然后TAB鍵结榄，即可快速生成頭文件。關(guān)于頭文件囤捻，以前經(jīng)常使用的是html:xt這個格式的臼朗，也就是dreamweaver自動生成的頭文件。不過現(xiàn)在標(biāo)準(zhǔn)的是html:5的頭文件，基本的瀏覽器都支持了视哑，沒什么問題绣否。

讓Sublime Text2支持快捷鍵在瀏覽器中預(yù)覽

用過dreamweaver的同學(xué)都知道，F(xiàn)12能快捷在瀏覽器中瀏覽正在編輯的文件挡毅。而這個功能在sublime需要蒜撮，點擊右鍵，然后open in browser跪呈。這顯然還不夠便捷段磨。下面來看怎么解決吧~

Sublime Text2支持用Python編寫插件，詳細步驟是：

一耗绿、點擊菜單Tools -> New Plugin…苹支，在創(chuàng)建好的py文件輸入下列內(nèi)容：

importsublime,sublime_plugin

importwebbrowser

url_map={

'/Users/jerry/Sites/test/':'http://test/',

}

classOpenBrowserCommand(sublime_plugin.TextCommand):

defrun(self,edit):

window=sublime.active_window()

window.run_command('save')

url=self.view.file_name()

forpath,domaininurl_map.items():

ifurl.startswith(path):

url=url.replace(path,domain).replace('\\','\/')

break

webbrowser.open_new(url)

將文件保存到Packages/User目錄（Packages可通過菜單里的Browser Packages…打開），文件名隨意误阻，如open_browser.py债蜜。插件部分完工了。

二堕绩、接下來策幼，為剛才的插件分配快捷鍵。點菜單Tools -> Command Palette…奴紧，或者f12特姐，打開命令集，選擇“key Bindings – User”打開個人快捷鍵配置黍氮，輸入下列內(nèi)容：

[{"keys":["f12"],"command":"open_browser"}]

這就是要做的全部工作唐含，可以測試下了。打開一個html文件沫浆，f12試試捷枯，沒意外的話文件會在默認(rèn)瀏覽器打開了。url_map里配置的站點目錄到URL的映射應(yīng)該也是可用的专执。

PS：如果要指定用什么瀏覽器預(yù)覽淮捆，也可以將最后一行代碼改成這樣：

webbrowser.get('safari').open_new(url)

webbrowser具體支持get哪些瀏覽器，可以通過webbrowser._browsers查看本股。只是攀痊，ST2默認(rèn)使用的是python2.6，在我的mac os下拄显，python2.6找不到任何可用的瀏覽器苟径。2.7的webbrowser.py里多了一段patch，可以找到firefox和safari躬审。好在棘街，對我來說蟆盐，能在默認(rèn)瀏覽器預(yù)覽已經(jīng)夠用了。

JS Format-Javascript的代碼格式化插件

很多網(wǎng)站的JS代碼都進行了壓縮遭殉，一行式的甚至混淆壓縮石挂，這讓我們看起來很吃力。而這個插件能幫我們把原始代碼進行格式的整理险污，包括換行和縮進等等誊稚，是代碼一目了然，更快讀懂~

LESS-LESS高亮插件

用LESS的同學(xué)都知道罗心，sublime沒有支持less的語法高亮，所以這個插件可以幫上我們

后記

不過由于編輯器過于快捷城瞎，也就是過于偷懶吧渤闷，所以不建議初學(xué)者使用~ ?– – ? ? ?還有更多功能，等你來發(fā)現(xiàn)

新增插件介紹文章：http://www.xuanfengge.com/practical-collection-of-sublime-plug-in.html