Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@zulhfreelancer

zulhfreelancer/Readme.md

Forked from mxstbr/Readme.md
Created April 2, 2018 09:43
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save zulhfreelancer/89af24456aa6c6ae4b41da5b93867196 to your computer and use it in GitHub Desktop.
Save zulhfreelancer/89af24456aa6c6ae4b41da5b93867196 to your computer and use it in GitHub Desktop.
Download ZIP
Enable tab completion for JSX with Emmet in Atom
Raw
Readme.md

Enable tab completion for JSX with Emmet in Atom

This guide assumes you have the emmet and language-babel packages already installed in Atom

Gif of the tab completion working

  1. Open the keymap.cson file by clicking on Atom -> Keymap… in the menu bar
  2. Add these lines of code to your keymap:
'atom-text-editor[data-grammar~="jsx"]:not([mini])':
  'tab': 'emmet:expand-abbreviation-with-tab'

Now open a file with JSX code, type div.myclass, press tab and it should autocomplete to <div className="myclass"></div>! (if it's not properly syntax highlighted, select Babel ES6 JavaScript or JSX as the syntax, this won't work otherwise)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment