永遠少年症候群

MENU

about

サイトは趣味の創作サイトです。著作権は特に明記のない限り放棄していません。
リンクはご自由にどうぞ。
画像リンクの際はこちらのバナー又はロゴをご利用ください。

かいてるひと

ぶくま

Search

novel

ファンタジー、恋愛要素、ハッピーエンド多め。
たまに暴力やグロテスクな表現があります。
小説一覧

Series

他の形式で読む

ブクログのパブー……電子書籍形式。詩の投稿はこちらのみ。
小説家になろう……ガラケー、スマホ対応。pdf形式の縦書き対応。

emmetを拡張したメモ
メモ 

 会社でsassとpugをコンパイルできるようになってって言われた。
 それまで爆速コーディングにはあんまりこだわってなかったのね。gulp入れてsassとpugの環境整えてpugの書き方を調べてコンパイルするより、タグ打ってemmetで展開で十分早かったし。
 まぁ、準備の時間がなかったってことね。

 で、入れたんだけど、思ったわけ。
 とにかくpugでmeta(charset=”utf-8″)とかずらずら書くのがクソダルい。

 pug → 早いコーディング
 html + emmet → 早いコーディング
 pug + emmet → めっちゃ早いコーディング なんじゃない……? ってね……!

atomでは使えない……!?

 atomのemmetパッケージでは、デフォルトではpugに対応していないので、!を展開すると普通にhtmlバージョンが展開される。
 そのうえ、コアパッケージでメジャーな言語はlanguage-xxxっていうパッケージが入ってるけど、pugは入ってないから、.pugで保存しても右下に表示されるファイルタイプがプレーンテキストになっちゃってる。

 なので、まずlanguage-pug-jadeっていうパッケージを導入し、ファイルタイプをきちんと認識してもらう。

拡張するための参考サイト

【参考サイト:Atom】Emmetのカスタマイズ| Atom講座 | [Smart]
【参考サイト:Brackets】Emmetを拡張してコーディングをもっと快適に!

 snippets.jsonを用意するってことだ。

pugで展開させる

 emmet本体のsnippets.jsonには、pugの前身であるjadeについては書いてあるけど、pugの文字はない。
 ので、追加する必要がある。

 これで!を展開すると、htmlで展開されるもののpugバージョンが展開される。
 だけど、せっかくだからlang=”ja”とかにしたいよね。
 metaタグも増やしたいよね。
 というわけで、私が追加したsnippets.jsonはこちら。

my snippets.json

 pugのvarとかforもぱっと出したいけど、そっちは説明出したかったのでatom標準のsnippets.csonに登録することにした。