SaltyCrane Blog — Notes on JavaScript and web development

Emacs espresso-mode for jQuery

Because js2-mode (20090723b) indents jQuery like this:

$(document).ready(function() {
                     $("a").click(function() {
                                     alert("Hello World");
                                  });
                  });

instead of this:

$(document).ready(function() {
   $("a").click(function() {
      alert("Hello World");
   });
});

I've switched to espresso-mode. Here's my install notes:

  • Download
    $ cd ~/.emacs.d/site-lisp
    $ wget http://download.savannah.gnu.org/releases-noredirect/espresso/espresso.el
  • Edit your .emacs:
    (add-to-list 'load-path "~/.emacs.d/site-lisp")
    (autoload #'espresso-mode "espresso" "Start espresso-mode" t)
    (add-to-list 'auto-mode-alist '("\\.js$" . espresso-mode))
    (add-to-list 'auto-mode-alist '("\\.json$" . espresso-mode))
  • Start emacs and byte-compile espresso.el:
    M-x byte-compile-file RET ~/.emacs.d/site-lisp/espresso.el

Side note: I just realized it is "espresso-mode" and not "expresso-mode".

Comments


#1 Jonathan Chu commented on :

Thanks for these notes Eliot! A while back, I spent a night making small mods to js2 for various annoyances; espresso mode seems to fit my needs perfectly.


#2 Eliot commented on :

Hey Jonathan, glad it was helpful. Yeah I had other small annoyances with js2-mode also. Unfortunately I didn't take the time to fix them like you did.


#3 Per Wiklander commented on :

According to emacs wiki:

"This is part of Emacs since version 23.2 under the name js-mode (with an alias javascript-mode)"


#4 Tikhon commented on :

You can actually use js2 mode for highlighting and espresso for indenting; look at the post here.

This was written before espresso was added to Emacs as js-mode, so in the code snippets you need to replace espresso with js.

I've been using js2 mode with this modification for both jQuery and node (nested callback galore), and have been perfectly happy.


#5 Eliot commented on :

Tikhon: Thanks for the tip. I haven't been editing much JS lately, but I will keep this in mind for the future.


#6 Jacob commented on :

Espresso is awesome. Thanks for posting this!


#7 Mikael commented on :

This plugin has been included in Emacs from version 23.2, thus no need any more to install separately if you are running an up-to-date version of Emacs :-)