Emmet
Emmet(以前名為Zen Coding[1])是一套面向文本編輯器的插件,它允許通過內容輔助高速度的編寫和編輯HTML、XML、XSL和其他結構化的代碼格式。此項目2008年由Vadim Makeev發起[2],並由Sergey Chikuyonok和其他Emmet用戶基於Zen Coding 2.0的概念繼續積極開發。[3]這套工具已經被一些高端的文本編輯器採納,以及存在於Emmet團隊開發或其他人獨立實現的插件中。不過,Emmet獨立於任何文本編輯器,它的引擎可以直接處理文本,而無需與任何特定軟件相關。[4]
Emmet以MIT許可證開源。
功能
編輯展開縮寫
編輯Emmet使用特定的語法來展開小段代碼,它類似CSS選擇器,使其成為完整的HTML代碼。[5]例如,下列序列:
div#page>div.logo+ul#navigation>li*5>a
將展開為:
<div id="page">
<div class="logo"></div>
<ul id="navigation">
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</div>
展開縮寫函數包含數個更加複雜的函數,例如用展開的代碼包裝一段代碼。[6]
標籤平衡
編輯HTML配對匹配器允許用戶定位當前光標位置的標籤所對應的開啟/閉合標籤(Tag)。不同於其他HTML配對匹配器,Emmet會從光標的當前位置開始搜索,而非從頭開始掃描文檔。[7]
文本編輯器
編輯Emmet團隊為以下文本編輯器開發了插件:
- Aptana/Eclipse(跨平台)
- Notepad++(Windows)
- NetBeans(跨平台)
- TextMate(Mac)
- Coda(Mac)
- Komodo Edit/IDE(跨平台)
- PSPad(Windows)
- <textarea>(基於瀏覽器)
- Bluefish (text editor)(Linux/Windows/Mac)
- Brackets(跨平台)
下列文本編輯器由第三方組織用官方Emmet引擎開發了插件:
- Atom(跨平台)
- Dreamweaver(Windows、Mac)
- Sublime Text(跨平台)
- Visual Studio(Windows)
- Visual Studio Code(跨平台)
- gedit(跨平台)
- AkelPad(Windows)
- UltraEdit(Windows)
- TopStyle(Windows)
- BBEdit/TextWrangler(Mac)
- EmEditor(Windows)
- EditPlus(Windows)
下列文本編輯器的插件為獨立開發,使用不同的Emmet引擎:
參考資料
編輯- ^ Rocha, Zeno. Goodbye, Zen Coding. Hello, Emmet!. Smashing Magazine GmbH. March 26, 2013 [March 15, 2015]. (原始內容存檔於2015-05-11).
- ^ First announcement of Zen HTML and Zen CSS bundles for TextMate. [2017-05-22]. (原始內容存檔於2017-03-23).
- ^ Zen Coding 2.0 concept. [2017-05-22]. (原始內容存檔於2017-06-24).
- ^ Smashing Magazine: Zen Coding: A Speedy Way To Write HTML/CSS Code. [2017-05-22]. (原始內容存檔於2015-06-24).
- ^ Monday By Noon: The Art of zen-coding: Bringing Snippets to a New Level. [2017-05-22]. (原始內容存檔於2016-06-12).
- ^ Download Squad Review. [2017-05-22]. (原始內容存檔於2019-10-22).
- ^ Smashing Magazine: Zen Coding: A Speedy Way to Write HTML/CSS Code. [2017-05-22]. (原始內容存檔於2015-06-24).