React.js syntax highlighting in Sublime Text

John Rooksby
Aug 25, 2017 · 1 min read

The default syntax highlighting / text colour in Sublime Text doesn’t play well with React.js code with JSX in it. This is annoying.

To resolve this, you can install Babel from Package Control.

To install it you need to:

  1. Go to the Package Control website, follow the “install now” link and follow the instructions there (if your copy of Sublime Text doesn’t say the version number, its probably v3). Restart sublime.
  2. In Sublime Text, press cmd+shift+p to bring up a menu. Scroll down to “Package Control: Install Package”. Select it, and then select Babel.
  3. In the Sublime Text menu choose View > Syntax > Babel > JavaScript (Babel). Or better yet choose … > open all with current extension as… > JavaScript (Babel).
)