Emmet（ソフトウェア）

エメット
開発者	エメティオ
リポジトリ	github .com /emmetio /emmet
書かれた	TypeScript、JavaScript
ライセンス	MITライセンス
Webサイト	エメット.io

Emmet（旧称Zen Coding ^{[ 1 ]} ）は、テキストエディタ用のプラグインのセットで、コンテンツアシストを介してHTML、XML、XSLT 、およびその他の構造化コード形式での高速コーディングと編集を可能にします。このプロジェクトは2008年にVadim Makeevによって開始され^{[ 2 ]}、Sergey ChikuyonokとEmmetユーザーによって積極的に開発され続けています。2015年以降、Mikael Geletsyan ^{[ 3 ]}がEmmetのUXを担当しています。ツールは、いくつかの一般的なテキストエディタに組み込まれているほか、Emmetチームが開発したプラグインや独自に実装されたプラグインもあります。ただし、Emmetは特定のソフトウェアではなくテキストを直接操作するため、基本的にどのテキストエディタからも独立しています。^{[ 4 ]}

Emmet はMIT ライセンスに基づいてオープンソース化されています。

機能

略語を展開

Emmetは、CSSセレクターに似た小さなコードスニペットを本格的なHTMLコードに展開するために、特定の構文を使用します。^{[ 5 ]}たとえば、シーケンス

div #ページ> div 。ロゴ+ ul #ナビゲーション> li * 5 > a

または

#ページ> .ロゴ+ ul #ナビゲーション> 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 > < / ul > < / div >

略語展開機能には、コードセクションを展開コードで囲むなどの複雑な機能もいくつか含まれています。^{[ 6 ]}

タグのバランス調整

HTMLペアマッチャーを使用すると、現在のカーソル位置にあるタグに対応する開始タグと終了タグを検索できます。他のHTMLペアマッチャーとは異なり、Emmetはドキュメントの先頭からスキャンするのではなく、カーソルの現在の位置から検索します。^{[ 7 ]}

テキストエディタ

以下のテキストエディタのプラグインはEmmetチームによって開発されました。

• Aptana/Eclipse (クロスプラットフォーム)。
• メモ帳++（Windows）
• NetBeans（クロスプラットフォーム）
• テキストメイト（Mac）
• コーダ（Mac）
• Komodo Edit/IDE（クロスプラットフォーム）
• PSPad（Windows）
• <textarea>（ブラウザベース）
• ブラケット（クロスプラットフォーム）

以下のテキストエディタプラグインは、公式Emmetエンジンを使用してサードパーティグループによって開発されました。

• Atom（クロスプラットフォーム）
• Dreamweaver（Windows、Mac）
• Bluefish エディター(クロスプラットフォーム)
• Sublime Text（クロスプラットフォーム）
• Visual Studio (Windows)
• Visual Studio Code（クロスプラットフォーム）
• gedit (クロスプラットフォーム)
• ウルトラエディット（Windows）
• TopStyle (Windows)
• BBEdit / TextWrangler (Mac)
• EmEditor (Windows)

以下のテキストエディタプラグインは、異なるEmmetエンジンを使用して独立して開発されました。

• Emacs（クロスプラットフォーム）
• IntelliJ IDEA / WebStorm / PhpStorm (クロスプラットフォーム)
• RJ TextEd (Windows)
• ティンクタ プロ (Mac)
• Vim (クロスプラットフォーム)

参考文献

1. Rocha, Zeno (2013年3月26日). 「さようなら、Zen Coding。こんにちは、Emmet！」 . Smashing Magazine . Smashing Magazine GmbH . 2015年3月15日閲覧。
2. "禅 HTML — Пепелсбей.net" .ペペルズベイ.net。
3. "クレジット" . emmet.io . 2018年11月27日閲覧。
4. 「Zen Coding: HTML/CSS コードを素早く記述する方法」 2009 年 11 月 21 日。
5. 「Zen-Codingの芸術：スニペットを新たなレベルに引き上げる」 mondaybynoon.com 、 2009年8月17日。
6. 「HTML をコーディングするなら、Zen Coding で人生が変わります」 。2013年1月22日。2013年1月22日時点のオリジナルよりアーカイブ。
7. 「Zen Coding: HTML/CSS コードを素早く記述する方法」 2009 年 11 月 21 日。

外部リンク

• 公式サイト