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

js2-modeを使う - インデントとフォールディング

emacs javascript

インデント

emacsjavascriptの読み書きといえば、js2-modeが有名ですが、デフォルトではインデントがちょっとおかしいです。
以下はbackbone.jsのモデルのサンプルですが、例えば以下の様にインデントされてしまいます。
横に長いです。

var Note = Backbone.Model.extend({
                                      initialize: function() { ... },
                                      author: function() { ... },
                                      coordinates: function() { ... },
                                      allowedToEdit: function(account) {
                                        return true;
                                      }
                                });


本当はこうインデントされて欲しい。

var Note = Backbone.Model.extend({
  initialize: function() { ... },
  author: function() { ... },
  coordinates: function() { ... },
  allowedToEdit: function(account) {
    return true;
  }
});

この問題については、対応方法があちこちのブログで紹介されています。

http://mihai.bazon.net/projects/editing-javascript-with-emacs-js2-mode
http://e-arrows.sakura.ne.jp/2010/12/closure-library-on-js2-mode.html


インデントについてはespresso.elを使う、というのがその方法です。

これらの設定方法を導入して使っていたのですが、フォークして修正している方がいてgithubにアップされていたので、それを使うことにしました。

https://github.com/mooz/js2-mode

M-x auto-install-from-url https://raw.github.com/mooz/js2-mode/master/js2-mode.el
(autoload 'js2-mode "js2-mode" nil t)
(add-to-list 'auto-mode-alist '("\\.js$" . js2-mode))

デフォルトで希望通りにインデントされました。

フォールディング

js2-modeにはコードフォールディングの機能があります。
上記のbackbone.jsの例にあるように、functionの本体をフォールディングして{ ... }と表示することができます

キーは C-c C-e に割り当てられています。(js2-mode-hide-element)
フォールディングを展開するのはC-c C-sです。(js2-mode-show-element)
C-c C-oでトグルもできます。(js2-mode-toggle-element)