search
LoginSignup
48

More than 5 years have passed since last update.

posted at

updated at

Emacs に zen-coding の後継の Emmet mode を入れる

便利ならしいzen-codingを入れてみたら、何でもEmmet という後継のがでてるらしいのでそっちを入れてみた。

Emmetの方はcssにも対応してるっぽい。多分他にも色々と違いがあるみたい。

インストール

cd ~/.emacs.d/site-lisp
wget https://raw.github.com/smihica/emmet-mode/master/emmet-mode.el

設定

(require 'emmet-mode)
(add-hook 'sgml-mode-hook 'emmet-mode) ;; マークアップ言語全部で使う
(add-hook 'css-mode-hook  'emmet-mode) ;; CSSにも使う
(add-hook 'emmet-mode-hook (lambda () (setq emmet-indentation 2))) ;; indent はスペース2個
(eval-after-load "emmet-mode"
  '(define-key emmet-mode-keymap (kbd "C-j") nil)) ;; C-j は newline のままにしておく
(keyboard-translate ?\C-i ?\H-i) ;;C-i と Tabの被りを回避
(define-key emmet-mode-keymap (kbd "H-i") 'emmet-expand-line) ;; C-i で展開

使い方

html ファイルで

ul#id>li.list*3

とか
css ファイルで

p1-2!+m10e+bd1#2s 

とか書くとステキに展開してくれる。

(初め動かなかったけど、scssファイルだったのが原因でした。パッチファイルを書いてマージしてもらったので今は動きます。)

他の使い方に関してはこちらを。
https://github.com/smihica/emmet-mode

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
48