Проверка и форматирование HTML-шаблонов

Форматер и линтер есть у каждого языка в вашем стеке, кроме HTML-шаблонов. Универсальные инструменты для HTML не умеют разбирать {% %} и {{ }}, а шаблонизаторам безразлично, как выглядит разметка вокруг них. djLint форматирует HTML, насыщенный шаблонным синтаксисом, и проверяет его на типичные ошибки. Есть профили для Django, Jinja, Twig, Nunjucks, Handlebars, Liquid, шаблонов Go и других.

uv tool install djlint
pip install djlint

найдите свой любимый язык шаблонов!

До и после

messy.html
{% block content %}
<SECTION class="posts">


<h2>Latest posts</h2>
{%if posts%}
<ul>
{% for post in posts %}
<li>
<a href="{% url 'post' post.slug %}" class="post-link {%if post.featured%}is-featured{%endif%}" data-analytics-id="post-{{post.id}}" aria-label="Read {{post.title}}">{{post.title|title}}</a>
</li>
{% endfor %}
</ul>
{%else%}
<p>No posts yet.</p>
{%endif%}
</SECTION>
{% endblock %}
$ djlint messy.html --reformat --single-attribute-per-line
{% block content %}
    <section class="posts">
        <h2>Latest posts</h2>
        {% if posts %}
            <ul>
                {% for post in posts %}
                    <li>
                        <a
                            href="{% url 'post' post.slug %}"
                            class="post-link {% if post.featured %}is-featured{% endif %}"
                            data-analytics-id="post-{{ post.id }}"
                            aria-label="Read {{ post.title }}"
                        >{{ post.title|title }}</a>
                    </li>
                {% endfor %}
            </ul>
        {% else %}
            <p>No posts yet.</p>
        {% endif %}
    </section>
{% endblock %}

Покажите, что код отформатирован!

Выглядит так:

html style: djLint

Добавьте значок в свои проекты:

[![Code style: djLint](https://img.shields.io/badge/html%20style-djLint-blue.svg)](https://github.com/djlint/djlint)
.. image:: https://img.shields.io/badge/html%20style-djLint-blue.svg
   :target: https://github.com/djlint/djlint

Участие в разработке

Мы рады вашему участию. Пришлите пул-реквест с новой возможностью или загляните в список задач и помогите, чем сможете.

GitHub