Remove unnecessary whitespace from Jinja rendered template

Solution 1:

Jinja has multiple ways to control whitespace. It does not have a way to prettify output, you have to manually make sure everything looks "nice".

The broadest solution is to set trim_blocks and lstrip_blocks on the env.

app.jinja_env.trim_blocks = True
app.jinja_env.lstrip_blocks = True

If you want to keep a newline at the end of the file, set strip_trailing_newlines = False.

You can use control characters to modify how the whitespace around a tag works. - always removes whitespace, + always preserves it, overriding the env settings for that tag. The - character can go at the beginning or end (or both) of a tag to control the whitespace in that direction, the + character only makes sense at the beginning of a tag.

• {%- if ... %} strips before
• {%- if ... -%} strips before and after
• {%+ if ... %} preserves before
• {%+ if ... -%} preserves before and strips after
• remember that {% endif %} is treated separately

The control characters only apply to templates you write. If you include a template or use a macro from a 3rd party, however they wrote the template will apply to that part.

Solution 2:

To collapse whitespace before and after a block:

{%- if form.message -%} //trims before
   {{ form.message }}
{%- endif -%} // trims after