読者です 読者をやめる 読者になる 読者になる

@Satoh_D no blog

大分にUターンしたので記念に。調べたこととか作ったこととか食べたこととか

Dreamwearverでおなじみ、閉じタグコメント挿入プラグインのSublime Text版を作りました

普段HTMLのコーディングをする際、
コードの見通しを良くするために毎回以下のように閉じタグの前にコメントをいれるようにしています。

<div id="foo" class="bar">
〜
<!-- /#foo.bar --></div>

このコメントはEmmetやZen-codingで"|c"を入力することで入れることが出来るのですが、閉じタグのにしか出力されません。
毎回コメントを出力して閉じタグの前にカット&ペーストするのも面倒...。
「それなら作っちゃえばいいんだ!」と思い作りました。

ちょうど元カヤックの渕上さんがDreamweaverで同じような拡張機能を作成されていたので挙動を参考にしました。
この場を借りてお礼申し上げます。

Dreamweaverでこの拡張機能にお世話になった方は多いので使用方法とかいまさら過ぎますよね...?
一応載せておきます。

使用方法

  • HTMLのソース内のコメントを挿入したい箇所(閉じタグの最初)にキャレットを置きます。
  • shift+command+,を入力
  • 閉じタグの前にid, classが書かれたコメントを挿入

Windowsの方はshift+ctrl+,で動きます。

パッケージのインストール方法

  1. Package Controlから「Package Control: Add Repository」を選択
  2. 入力ボックスに「https://github.com/Satoh-D/CloseCommentTag」を入力
  3. Package Controlから「Package Control: Install Package」を選択
  4. 「CloseCommentTag」を選択

詳しいことは使っていただけますとわかるかと思います。
バグ等ありましたらお知らせ下さい。

【2014.08.06 追記】 このパッケージをPackage Controlへの登録を依頼してみました。
その時のメモをまとめました。

【2014.08.13 追記】 コメントを入れたい要素内にh1〜h6等の数値が含まれる要素がある場合、正しくコメントが出力されないバグがありました。
既に修正し、Githubに反映済みです。
自動更新が反映されるのを待つか、パッケージの再インストールをお願いします。

【2014.08.13 追記02】 id, class名がない場合、要素名をコメント内に出力するよう変更しました。