BracketsのEmmetを自分用にカスタマイズ
この記事は2015年10月15日に書かれたもので、内容が古い可能性がありますのでご注意ください。
Bracketsを自分用にカスタマイズした時の備忘録。
コメントを内側にする
コードを打ち込む時に、どこが閉じタグなのか分かりやすい用にコメントを出力するのですが、
仕事では内側に書く事がほとんどなので、こちらを修正してみました。
通常は以下のように出力されますよね。
<div id="hoge"> </div><!-- /#hoge -->
こうしたい！
<div id="hoge"> <!-- /#hoge --></div>
まずは以下の修正するファイルを開きます。不安な方はバックアップを取っておきましょう。
C:\Users\ユーザー名\AppData\Roaming\Brackets\extensions\user\brackets-emmet\node_modules\emmet\lib\filter\comment.js
node.end = node.end.replace(/>/, '>' + nodeAfter);
を、下記のコードに変更してします。
node.end = node.end.replace(/</, nodeAfter + '<' );
再起動すれば内側に出力されるようになります。
id、classがあれば自動でコメント出力する
そもそもコメントを挿入する際|cで対応しますが、いちいち打つのが面倒になってきたので、
自動で出力するように変更したいと思います。
以下のファイルを修正します。
C:\Users\ユーザー名\AppData\Roaming\Brackets\extensions\user\brackets-emmet\node_modules\emmet\lib\snippet.json
"html": {
"filters": "html",
"profile": "html",
を、下記のコードに変更してします。
"html": {
"filters": "html,c",
"profile": "html",
再起動すればOK。
ついでに日本語に変更する
snippet.jsonを修正したついでにhtmlのひな形出力される設定を日本語用に変更してみます。
"variables": {
"lang": "en",
"locale": "en_US",
"charset": "UTF-8",
"indentation": "\t",
"newline": "\n"
},
を、下記のコードに変更してします。
"variables": {
"lang": "ja",
"locale": "ja-JP",
"charset": "UTF-8",
"indentation": "\t",
"newline": "\n"
},
再起動すればOK。
以上！
ads
