Blog of Raivo Laanemets

Stories about web development, consulting and personal computers.

Simple EJS highlighter for Sublime Text 3

On 2016-05-08

The standard EJS package for Sublime Text 3 is broken. This post shows a trivial alternative. There is EJS 2 package but it is broken too because valid EJS is NOT always valid JavaScript. This happens when EJS tag ends a JavaScript block, like <% }) %> in a forEach call. In the same way, this fork is broken too.

I have added my own solution. It just highlights the EJS tag as a whole and does not dive into it. I did it the same way in Kate. In order to "install" this solution, create a file EJS.sublime-syntax into the Packages/EJS directory (create EJS directory where Preferences->Browse Packages opens). The any "official" EJS package must be uninstalled.

# See
name: EJS
  - ejs
scope: text.html.ejs
    - include: scope:text.html.basic
    - match: '(<%(-|=)?.+?%>)'
      scope: ejs

Then add the ejs scope color into your theme (the tmTheme file of the active theme, possible hints on doing it are here):


With my theme and settings, the output looks like:

Sublime Text 3 simple EJS highlighter

Update 2016-11-02

I have improved the highlighter to properly highlight multiple EJS fragments on the same line. This required change to make the match regex non-greedy. The full code snippet above has the fix.