Escaping | LiquidJS

Escaping is important in all languages, including LiquidJS. While escaping has 2 different meanings for a template engine:

Escaping for the output, i.e. HTML escape. Used to escape HTML special characters so the output will not break HTML structures, aka HTML safe.
Escaping for the language itself, i.e. Liquid escape. Used to output strings that’s considered special in Liquid language. This will be useful when you’re writing an article in Liquid template to introduce Liquid language.

HTML Escape

By default output is not escaped. While you can use escape filter for this:

Input

{{ "1 < 2" | escape }}

Output

1 &lt; 2

There’s also escape_once, newline_to_br, strip_html filters for you to fine tune your output.

In cases where variables are mostly not trusted, outputEscape can be set to "escape" to apply escape by default. In this case, when you need some output not to be escaped, raw filter can be used:

Input

{{ "1 < 2" }}
{{ "<button>OK</button>" | raw }}

Output

1 &lt; 2
<button>OK</button>

Liquid Escape

To disable Liquid language and output strings like {{ and {%, the raw tag can be used.

Input

{% raw %}
  In LiquidJS, {{ this | escape }} will be HTML-escaped, but
  {{{ that }}} will not.
{% endraw %}

Output

In LiquidJS, {{ this | escape }} will be HTML-escaped, but
{{{ that }}} will not.

Within strings literals in LiquidJS template, \ can be used to escape special characters in string syntax. For example:

Input

{{ "\"" }}

Output