Emmet JSX autocompletion in Atom

I was getting annoyed that my Emmet shortcuts were not working in Atom when I’m writing React/JSX files. None of the Emmet shorthands were expanding, until I found this bit of information.

Making Emmet shortcuts work for JSX files in Atom

  1. Open Atom menu -> Keymap…
  2. Add this line to the keymap file

    atom-text-editor[data-grammar=”source js jsx”]:not([mini])’: ‘tab’: ’emmet:expand-abbreviation-with-tab

This will expand .col-sm-8 to

<div className="col-sm-8"></div>