Notion app logo
Struggling to stay organized and effective? Learn to master your time and tasks with the Effectively Notion course!

Emacs - Highlight $FlowFixMe comments in JavaScript

Learn how to setup conditional highlighting for Emacs by writing emacs-lisp to highlight $FlowFixMe


I've been working with Flow a lot since joining Webflow and one of the things that I constantly miss is the // $FlowFixMe comments. I decided to highlight // $FlowFixMe comments in red so they stood out.

Emacs makes it trivial to add configuration to highlight specific lines based on certain criteria. In init.el or any file that you load configuration through, you can add the following:

  (defface flow-fix-me-comment '((t (:foreground "#ff0000"))) "Red")

   'js-mode '(("// $FlowFixMe" 0 'flow-fix-me-comment t)))

Breaking it down:

  • defface allows us to declare a customizable FACE (you can think of FACE as a style). We're naming it flow-fix-me-comment
  • font-lock-add-keywords allows us to highlight a mode based on a specific keyword.
  • 'js-mode is the mode we want to highlight on.
  • "// $FlowFixMe" is the term we want to use as the criteria for highlighting.
  • If the term matches the line, apply the flow-fix-me-comment FACE.

Make sure to eval-buffer on the snippet, reload your config or restart Emacs to see the changes take place.

The end result will look like this:

Use Emacs to highlight $FlowFixMe in Javascript

If you're using Emacs to develop for JavaScript and using Flow in your projects, this is a great way to make sure you don't get burnt by any $FlowFixMe comments during development!

Photo of Chase Adams

Hey, I'm Chase. I help aspiring entrepreneurs and makers turn their ideas into digital products and apps.


Vector Arrow Scribbles
banner image for figma vector arrows scribbles

A figma community project of vectorized hand-drawn arrows.

Go To Figma
Vector Line Scribbles
banner for figma vector line scribbles

A figma community project of vectorized hand-drawn lines.

Go To Figma
Vector Shape Scribbles
banner image of figma vector shapes scribbles

A figma community project of vectorized hand-drawn shapes.

Go To Figma

Subscribe to my Newsletter

Every other week I publish the Curiously Crafted newsletter.

In it, I explore the intersection of curiosity and craft: the people who make stuff, what they make and the way they pursue the craft of making.


I'm on almost all social media as @curiouslychase.

The curious logo of Chase Adams: glasses and a bow tie.stay curious.