JSX in Emacs
A few years ago, I regretted contributing JSX indentation support to Emacs 25. I wished I had not promoted a non-standard language extension for the trouble it would cause.
My outlook on language extensions has changed. Whether or not a committee from a standards organization agreed on the legitimacy of language features is irrelevant. Programming languages that serve all of society may stem from one man’s mind. Extensions may provide useful abstractions for specific domains, elevating their languages to higher levels; thus, there is greater parity between the syntax and the effect of code, which is a good thing.
So, rather than continue to admonish it, I recently set out to improve Emacs’ JSX support. My improvements will be shipping in the upcoming release of Emacs 27.
Indenting JSX in Emacs
The test suite for indentation has grown quite a lot, and my personal experience using the improved logic has been largely without issue.
JSX Syntax Highlighting in Emacs
Back when I was working on my first round of contributions, I was less concerned with syntax-based highlighting due to my excitement over the context-based variety. However, due to the complexity and performance implications of cutting-edge technology, and its merely marginal advantages over its predecessor, I’ve since drifted back to more traditional ways of reading code. For the good of all, since my code coloring concerns again align with 99.99% of users.
So, I added syntax highlighting for JSX, too.
Automatically Enabling JSX Support in Emacs
JSX support needed to be opted-into, either by activating
js-jsx-mode, or by naming files with a “.jsx” extension. Unfortunately, this obfuscated the feature in the very common case where programmers used “.js” for their files; and what’s the point of having JSX support if many people don’t know it’s there?
Trying It Out
To take my latest improvements for a spin, first check the homepage to see if Emacs 27 has been released yet.
As of this writing, Emacs 27 is not out yet, nor is there a release candidate. However, for macOS users, you can always install a Nightly build from Emacs For Mac OS X (scroll down to “Nightlies”). For GNU/Linux users, you can compile from source. The incantations for that will probably be similar to these:
sudo apt remove emacs sudo apt build-dep emacs git clone git://git.sv.gnu.org/emacs.git cd emacs git checkout emacs-27 ./autogen.sh ./configure make sudo make install
Note that the changes are provided by
js-mode. They won’t work with
js2-mode, for instance (at least until the following issues are resolved: #527, #528, #529, #530; volunteers welcome). If you were using
js2-mode, remove its entry from
I hope it works well for you! (If not, please submit a bug report to email@example.com. You can also do that with