Sublime Text 的官方 Emmet 外掛程式。
警告:此外掛程式在某些作業系統中可能根本無法運作,因為它是用 JavaScript 編寫並使用 PyV8 和 Google V8 二進位檔案運行的。如果您遇到問題或編輯器崩潰,請填寫問題。
透過包控制:
Emmet
程式。手動:
警告:安裝插件後,它將自動下載所需的 PyV8 二進位文件,因此您必須稍等一下(請參閱狀態列上的載入 PyV8 二進位訊息)。如果您遇到自動 PyV8 載入程式的問題,請嘗試手動安裝。
遞增/遞減數位操作:
您可以使用新操作和過濾器輕鬆擴展 Emmet,或自訂現有操作和過濾器。在Emmet.sublime-settings
中,定義extensions_path
設置,Emmet 將在啟動時載入指定資料夾中的所有.js
和.json
檔案。
extensions_path
的預設值為~/emmet
,它指向作業系統使用者主資料夾內的emmet資料夾。
此外,您可以在使用者的Emmet.sublime-settings
檔案中建立名為擴充檔案的部分(例如snippets
、 preferences
和syntaxProfiles
),並在其中寫入您的自訂設定。有關範例,請參閱原始設定檔。
Sublime Text 是一款出色的文字編輯器,具有許多功能和操作。大多數這些操作都綁定到鍵盤快捷鍵,因此幾乎不可能為第三方插件提供方便的插件快捷鍵。
如果您對預設鍵盤映射不滿意,可以使用Emmet.sublime-settings
檔案的disabled_keymap_actions
首選項停用各個鍵盤快速鍵。
使用逗號分隔的操作名稱列表,應停用預設鍵盤快速鍵。例如,如果要釋放Ctrl+E (「擴充縮寫」)和Ctrl+U (「更新影像大小」)快速鍵,則必須設定下列值:
"disabled_keymap_actions": "expand_abbreviation, update_image_size"
您應該參考Default (Your-OS-Name).sublime-keymap
檔案來取得操作 ID(尋找args/action
key)。
若要停用所有預設快捷方式,請將值設為all
:
"disabled_keymap_actions": "all"
並不是說,如果您像這樣禁用了任何操作並且創建了自己的鍵盤快捷鍵,則不應使用emmet_action_enabled.ACTION_NAME
上下文,因為這是禁用操作的鍵。
Emmet 僅以有限的語法擴充縮寫:HTML、CSS、LESS、SCSS、Stylus 和 PostCSS。將 Tab 處理程序限制為有限的語法清單的原因是因為它破壞了本機 Sublime Text 片段。
如果您想在其他語法(例如 JSX、HAML 等)中使用 Tab 縮寫,則必須調整鍵盤快速鍵設定:為所需語法範圍選擇器的tab
鍵新增expand_abbreviation_by_tab
指令。若要取得目前語法範圍選擇器,請按⇧⌃P (OSX) 或Ctrl+Alt+Shift+P ,它將顯示在編輯器狀態列中。
前往Preferences
> Key Bindings — User
並插入以下 JSON 片段,其中包含正確配置的範圍選擇器而不是SCOPE_SELECTOR
令牌:
{
"keys" : [ "tab" ] ,
"command" : "expand_abbreviation_by_tab" ,
// put comma-separated syntax selectors for which
// you want to expandEmmet abbreviations into "operand" key
// instead of SCOPE_SELECTOR.
// Examples: source.js, text.html - source
"context" : [
{
"operand" : "SCOPE_SELECTOR" ,
"operator" : "equal" ,
"match_all" : true ,
"key" : "selector"
} ,
// run only if there's no selected text
{
"match_all" : true ,
"key" : "selection_empty"
} ,
// don't work if there are active tabstops
{
"operator" : "equal" ,
"operand" : false ,
"match_all" : true ,
"key" : "has_next_field"
} ,
// don't work if completion popup is visible and you
// want to insert completion with Tab. If you want to
// expand Emmet with Tab even if popup is visible --
// remove this section
{
"operand" : false ,
"operator" : "equal" ,
"match_all" : true ,
"key" : "auto_complete_visible"
} ,
{
"match_all" : true ,
"key" : "is_abbreviation"
}
]
}
Emmet 外掛程式可讓您使用Tab鍵擴充縮寫,就像常規片段一樣。另一方面,由於動態特性和廣泛的語法,有時您可能會得到意想不到的結果。本節介紹 Tab 處理程序的工作原理以及如何微調。
預設情況下,Tab 處理程序在有限的語法範圍內工作:HTML、XML、HAML、CSS、SASS/SCSS、LESS、PostCSS 和程式語言中的字串(如 JavaScript、Python、Ruby 等)。這意味著:
line
特殊輸出設定檔產生輸出,該設定檔將輸出產生為單行。要微調 Tab 鍵處理程序,您可以在使用者的Emmet.sublime-settings
檔案中使用以下設定:
disable_tab_abbreviations_for_scopes
— 應停用 Tab 鍵處理程序的語法範圍的逗號分隔清單。例如,如果您想停用程式語言和 HAML 語法字串內的處理程序,您的設定將如下所示: "disable_tab_abbreviations_for_scopes" : " text.haml, string "
disabled_single_snippet_for_scopes
— 以逗號分隔的語法範圍列表,在擴充單個縮寫時應停用 Tab 處理程序。目前,ST 不提供用於取得本機片段清單的 API。因此,例如,如果您嘗試擴展php
縮寫,它將被傳遞到 Emmet,後者輸出
而不是本機 ST 片段中定義的 PHP 區塊。作為解決方法,如果您嘗試在disabled_single_snippet_for_scopes
設定中定義的範圍內擴展單個縮寫,Emmet將首先在其自己的片段目錄中查找其名稱,然後在known_html_tags
設定中查找,如果未找到,則允許ST處理它並展開本機縮寫(如果符合)。known_html_tags
— 用於如上所述查找的所有已知 HTML 標籤的空格分隔清單。如果您對 Emmet 選項卡處理程序行為不滿意,可以停用它:只需將"disable_tab_abbreviations": true
新增至使用者的Preferences.sublime-settings
檔案中。
如果您的工作流程已包含 CSS 供應商前綴的自動化任務(例如 Autoprefixer),您可以停用 Emmet 的自動供應商前綴插入,將此選項新增至使用者的Emmet.sublime-settings
檔案:
{
"preferences" : {
"css.autoInsertVendorPrefixes" : false
}
}