Two hills I’m prepared to die on are the superiority of modal editing and the near limitless power and customization of Emacs.

While vscode, atom, etc are nice and have decent communities building plugins around them, I’ll be configuring emacs to take me on my journey to learn javascript.

There is a built in javascript mode with very basic functionality but we want better highlighting and parsing plus syntax checking. This is where js2-mode comes in: http://elpa.gnu.org/packages/js2-mode.html

I’m going to make two assumptions here:

  1. You already have flycheck installed or will go read about it and set it up yourself.
  2. You are using use-package to manage your package installs and configuration like me, or know how to adapt my examples for your own preferred method.

This snippet will get js2-mode installed and set as the default mode for all .js files you edit. It is also setting some indentation preferences and disabling some built in syntax checking options (we’ll be leveraging flycheck and jshint).

;; a better javascript mode
(use-package js2-mode
  :mode "\\.js\\'"
  :config
  (setq js2-mode-show-parse-errors nil
        js2-mode-show-strict-warnings nil
        js2-basic-offset 2
        js-indent-level 2)
  (electric-pair-mode 1))

Now we can install jshint for linting / syntax checking purposes.

npm install -g jshint

Followed by creating a global .jshintrc file in our home directory. See a full set of options here: .jshintrc

{
  "asi"       : true,
  "esversion" : 6
}

We’re now ready to start hacking around with javascript code with full syntax checking and highligting.

Better code auto-completion would be nice, but we’ll tackle that next time. B-)