Remove unnecessary whitespace from Jinja rendered template

PythonFlaskJinja2

Python Problem Overview


I'm using curl to watch the output of my web app.

When Flask and Jinja render templates, there's a lot of unnecessary white space in the output.
It seems to be added by rendering various components from Flask-WTF and Flask-Bootstrap.

I could strip this using sed, but is there a way to control this from Jinja?

Python Solutions


Solution 1 - Python

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 - Python

To collapse whitespace before and after a block:

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

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionHexatonicView Question on Stackoverflow
Solution 1 - PythondavidismView Answer on Stackoverflow
Solution 2 - PythonAnasView Answer on Stackoverflow