我已經有一段時間沒有寫有關Sublime Text以及它對於我這個Web前端開發工程師帶來的好處的文章了。正是由於它的包的特性,使得我已經有3年多沒有更換文字編輯器/IDE了。我甚至還專門建立了一個wiki(在一定程度上)去幫助使用者更好使用,並針對需求選擇最好的包。這篇文章將只會關注那些我認為大多數前端開發者在開發中需要用到的包。
Package Control
在你安裝其他包之前,請確保你最先安裝Package Control。它會讓其他包的安裝和更新異常簡單。
針對寫程式碼
Emmet
Emmet(之前被叫做Zen Coding)是一個可以極大提高web開發者HTML和CSS工作效率的工具箱元件。你可以在http://emmet.io/檢視更多資訊。
SublimeLinter
Sublime Text3下的互動式程式碼校驗框架。你可以在這裡找到安裝指南,並且不同的語言需要其特定的外掛,請參見這個列表。
jQuery
這個包為jQuery的大部分方法提供了示例程式碼段,讓它的API更加容易使用。
Inc-Dec-Value
增加/減少數字(包括整數和分數),日期,十六進位制顏色碼,配置值對映關係或者迴圈列舉。此外還有字串操作(轉大寫,轉小寫),在這裡可以看完整的相關配置。
ColorHighlighter
ColorHighlighter是一個Sublime Text2和3都可用的外掛,它可以展示你所選擇的顏色程式碼(像“#FFFFFF”, “rgb(255,255,255)”, “white”, 等等)的真正顏色。同時它還包含一個顏色選擇器讓你可以方便地更改顏色。
Convert case
這個外掛可以把選擇地詞語/代號在pascal, camel, snake, dot, dash和分開的單詞這幾種寫法之間轉換。
(譯者注——
pascal寫法:VariableNameLikeThis
camel寫法:variableNameLikeThis
snake寫法: variable_name_like_this
dot寫法: variable.name.like.this
dash寫法: variable-name-like-this
分開的單詞: variable name like this)
BracketHighlighter
括號和標籤高亮顯示的外掛
AlignTab
一個使用正規表示式來幫助對齊的外掛
MultiEditUtils
該外掛用於幫助多重選擇下的編輯
針對使用者介面
增強編輯器的側邊欄。包括檔案和資料夾。
Origami
你可以隨心所欲地分割視窗!建立新板塊,刪除板塊,在板塊之間移動或複製顯示內容。
Modific
高亮自上次提交後修改過的程式碼行(支援Git,SVN,Bazaar,Mercurial以及TFS)
Soda Theme
Sublime Text的暗色及亮色自定義UI主題。我用的是暗色版,個人比較喜歡這個主圖。還有其他更多主題可以在這個列表裡面找到。
Themr
Sublime Text的一個UI主題選擇器。
ColorSchemeSelector
這個外掛可以讓你通過迅捷皮膚快速地選擇主題。
Base16 Color Schemes
我個人最喜歡地Sublime顏色方案
TabsExtra
該外掛提供黏滯tab以及更多地關閉tab選項和額外地選單選項。
針對特定的語言
SCSS
一個Sass和SCSS的語法包
Sass Snippets
Sass程式碼段外掛
CSS3 Syntax
該外掛可以增強Sublime預設的針對CSS的高亮。
JavaScriptNext
這是一個針對JS的加強語法包。它是基於那些常用的語言檔案建造的並新增了更多細節的匹配,而且它還包含了來自ECMAScript6的一些新特性例如模組,簡明方法,箭頭函式, 類, 生成器,以及訪問器(ES5)。
如果你想對於每個js檔案都使用它的話,建立或開啟一個js檔案,然後你需要點選右下角愈語法名字按鈕,然後選擇‘Open all with current extension as’下面的JavascriptNext – ES6 > JavascriptNext
Liquid
Liquid模版。如果你開發Jekyll站點的話會很有用。
針對一般性幫助
FindKeyConflicts
用於找出鍵值對映(Key Mapping)衝突的外掛。
用於搞笑
Sound
該外掛會給許多sublime操作新增音效。給同事的sublime偷偷裝上是不錯的惡作劇。
想要改變某些設定麼?
sublime的預設設定很不錯但是幾乎所有的地方都可以進行修改以使其更符合你的口味。請看看我自己的設定可以瞭解你大概可以做什麼