Skip to content

Instantly share code, notes, and snippets.

@mxstbr
Last active September 1, 2017 02:02
Show Gist options
  • Save mxstbr/3db2e987ffbb85cf19e65b8a63adb504 to your computer and use it in GitHub Desktop.
Save mxstbr/3db2e987ffbb85cf19e65b8a63adb504 to your computer and use it in GitHub Desktop.
Syntax highlighting ESNext (inc. JSX) for Keynote presentations

Syntax Highlighting ESNext (inc. JSX)

To get syntax highlighting for ESNext (including JSX), you need to have pygments-lexer-babylon installed:

pip install pygments pygments-lexer-babylon

Now when you run pygmentize on a .jsx file it'll automatically use the new lexer! 🎉

If you want to force the babylon lexer to be used on files ending in .js, use the -l jsx option on the command line. Something like this:

pygmentize -l jsx myfile.js

Shortcuts for Keynote

I've added two functions to my .zshrc to allow me to quickly highlight and copy files for keynote presentations:

function hl() {
  PYGMENTS_NODE_COMMAND=node pygmentize -f rtf $* | pbcopy
}

function hljsx() {
  PYGMENTS_NODE_COMMAND=node pygmentize -f rtf -l jsx $* | pbcopy
}

The PYGMENTS_NODE_COMMAND stuff is necessary because by default it assumes node to be runnable with nodejs, which it isn't on my machine. YMMV, you can remove that part if calling nodejs -v in your terminal doesn't throw an error.

This is how you use them, hl is used for everything, and if I need to force ESNext/JSX support I'll use hljsx:

hl styles.css
hl MyComponent.jsx
hljsx MyComponent.js

You can also pass as many options as you'd like into both, for example to highlight in monokai:

hljsx MyComponent.js -O style=monokai
@jcubic
Copy link

jcubic commented Aug 27, 2017

running pip install pygments pygments-lexer-babylon make jsx work with jekyll, thanks.

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