Sublime Text 3 插件手冊

看了一下給 Sublime Text 3 裝的幾個常見插件，一直沒有研究這些插件的用法，俗話說「工欲善其事，必先利其器」，仍是得好好研究一下這些插件該如何應用，才能讓本身更高效地工做，不是麼？

---

Alignment

插件官網：Alignment

插件用途：該插件用於多行相鄰的賦值語句以指定符號對齊，好比 CSS 樣式設置中以冒號對齊，好比 JavaScript 多變量賦值時以等號對齊，talk is cheap and I'll show you the code!

快捷鍵：Ctrl + Alt + A （ 與 QQ 默認的截圖快捷鍵衝突，在用戶自定義的按鍵綁定文件中已改爲了 Ctrl + Shift + A ）。

示例一：CSS 代碼對齊

/* before */
.test {
  font-family: Georgia, serif;
  font-size: 16px;
  font-style: normal;
}

/* after */
.test {
  font-family : Georgia, serif;
  font-size   : 16px;
  font-style  : normal;
}

該插件默認只能以等號對齊，要實現上面示例一這樣以分號對齊的效果，須要在該插件的用戶自定義配置文件中加上下面一段內容：

{
  // The mid-line characters to align in a multi-line selection, changing
  // this to an empty array will disable mid-line alignment
  "alignment_chars": [
    "=", ":"
  ]
}

該插件用戶自定義配置文件的位置以下：

• Windows: Preferences > Package Settings > Alignment > Settings - User

• Linux: Preferences > Package Settings > Alignment > Settings - User

• Mac OS X: Sublime Text 2 > Preferences > Package Settings > Alignment > Settings - User

示例二：多變量賦值

# before
short_open_tag = Off
asp_tags = Off
precision = 14
y2k_compliance = On

# after
short_open_tag = Off
asp_tags       = Off
precision      = 14
y2k_compliance = On

示例三：含長變量名的多變量賦值

# align by default
short_open_tag                = Off
asp_tags                      = Off
precision                     = 14
y2k_compliance                = On
zlib.output_compression_level = -1

# align by short variable
short_open_tag = Off
asp_tags       = Off
precision      = 14
y2k_compliance = On
zlib.output_compression_level = -1

參考文章：How to install & use Sublime Alignment

---

AutoFileName

插件官網：AutoFileName

插件用途：該插件用於 Web 開發或其它開發情境下，本地文件路徑的自動完成。

該插件默認已開啓，無需快捷鍵，用圖說話：

---

BracketHighlighter

插件官網：BracketHighlighter

插件用途：該插件用於高亮顯示成對匹配的括號、引號或其它符號、標記，並可對匹配的一對符號之間的內容進行操做（這是關鍵功能）。

經過在用戶定義的鍵盤映射文件中設置該插件的快捷鍵，可實現如下經常使用功能：

• 跳轉到左側括號的右端（或右側括號的左端）；

• 選擇匹配的一對括號內的文本，可選是否包含括號；

• 選擇 HTML/XML 標籤的標籤名 (開始標籤和閉合標籤都會被選中，便於修改)；

{% asset_img Sublime-Text-BracketHighlighter-Select-Both-Tag-Names.jpg 選擇一對 HTML 標籤的標籤名 %}

• 選擇光標所在處的屬性及對應的值 （光標必須在屬性處，不能超出單詞的最左或最右側）；

{% asset_img Sublime-Text-BracketHighlighter-Select-Property-And-Its-Value.jpg 選擇光標所在處的屬性及對應的值 %}

• 摺疊 / 展開一對匹配的括號內的文本；

{% asset_img Sublime-Text-BracketHighlighter-Fold-Content-Between-Brackets.jpg 摺疊一對匹配的括號內的文本 %}

• 用快捷面板中的括號將所選擇的代碼段括起來（用 Visual Studio 寫 C# 代碼時就有相同的功能）。

{% asset_img Sublime-Text-BracketHighlighter-Surround-Selection-With-Brackets-From-Quick-Panel.jpg 用快捷面板中的括號將所選擇的代碼段括起來 %}

---

Emmet

插件官網：

插件用途：

---

未完待續~~~