格式化工具用法
djLint 的格式化工具能把凌亂的 HTML 範本整理成一致、易讀的格式!
套用變更前,請先用 --check 檢視輸出結果。
若要檢視格式化可能會變更哪些地方,請執行:
djlint . --check
若要格式化程式碼並更新檔案,請執行:
djlint . --reformat --single-attribute-per-line
# 也想格式化 script 和 style 嗎?
djlint . --reformat --single-attribute-per-line --format-css --format-js
來看個範例!
格式化前
這是一團急需整理的 HTML:
{% load admin_list %}
{% load i18n %}
<p class="paginator">
{% if pagination_required %}
{% for i in page_range %}
{% paginator_number cl i %}
{% endfor %}
{% endif %}
{{ cl.result_count }}
{% if cl.result_count == 1 %}
{{ cl.opts.verbose_name }}
{% else %}
{{ cl.opts.verbose_name_plural }}
{% endif %}
{% if show_all_url %}
<a href="{{ show_all_url }}" class="showall">{% translate 'Show all' %}</a>
{% endif %}
{% if cl.formset and cl.result_count %}
<input type="submit" name="_save" class="default" value="{% translate 'Save' %}">
{% endif %}
</p>
格式化後
現在看起來好一點了……至少讀得懂了 :)
{% load admin_list %}
{% load i18n %}
<p class="paginator">
{% if pagination_required %}
{% for i in page_range %}
{% paginator_number cl i %}
{% endfor %}
{% endif %}
{{ cl.result_count }}
{% if cl.result_count == 1 %}
{{ cl.opts.verbose_name }}
{% else %}
{{ cl.opts.verbose_name_plural }}
{% endif %}
{% if show_all_url %}
<a href="{{ show_all_url }}" class="showall">{% translate "Show all" %}</a>
{% endif %}
{% if cl.formset and cl.result_count %}
<input type="submit"
name="_save"
class="default"
value="{% translate 'Save' %}">
{% endif %}
</p>
使用 single_attribute_per_line 格式化後
偏好 Prettier 風格的屬性排列嗎?請啟用 single_attribute_per_line 選項:
{% load admin_list %}
{% load i18n %}
<p class="paginator">
{% if pagination_required %}
{% for i in page_range %}
{% paginator_number cl i %}
{% endfor %}
{% endif %}
{{ cl.result_count }}
{% if cl.result_count == 1 %}
{{ cl.opts.verbose_name }}
{% else %}
{{ cl.opts.verbose_name_plural }}
{% endif %}
{% if show_all_url %}
<a href="{{ show_all_url }}" class="showall">{% translate "Show all" %}</a>
{% endif %}
{% if cl.formset and cl.result_count %}
<input
type="submit"
name="_save"
class="default"
value="{% translate 'Save' %}"
>
{% endif %}
</p>