1

我正在尝试创建独立的前端模块（HTML、CSS 和 JS）以集成到 Django 应用程序中。我的意思最好的例子是“地图”模块，我想将它包含在各种不相关的页面中，可能在每个页面的不同位置。

我有一个模板，它提供了地图所需的 HTML 代码，并且我希望 CSS 和 JS 代码也包含在此模板中，以简化前端依赖项的处理。到目前为止，这可以使用{% include %}标签来实现。

但是在前端性能方面，在 HTML 页面中间包含样式表和脚本是一种非常糟糕的做法。（CSS 应该包含在 中<head>，JS 应该包含在末尾<body>）

{% include %}如果标签被呈现为包含它们的模板的一部分并且可能具有覆盖标签，那么我的问题可能已经解决{% block %}。在 Django 中情况并非如此。{% include %}标签首先呈现为 HTML，然后才包含在内，因此它们不能覆盖{% block %}标签。

回顾过去围绕这个主题提出的问题表明，普遍的智慧是使用模板继承（即{% extends %}）而不是{% include %}，但由于我希望我的模块是独立的，所以我不知道如何在我的情况下使用继承。

在保持前端性能最佳实践的同时，我可以做些什么来维护模板内的前端依赖项？

谢谢！

4

1 回答 1

1

要首先创建地图模板标签，请使用包含标签。

关于静态文件的问题，我会创建一个相关的模板标签，将静态文件引用转储到您当前的模板中。然后将该模板标签包含在一个块中。

如果您的基本模板在 base.html 中，而页面模板在 page.html 中：

base.html

<html>
    <head>
        {% block css %}
            <link rel="stylesheet...
        {% endblock %}
    </head>
    <body>
        {% block content %}{% endblock %}
        {% block scripts %}{% endblock %}
    </body>
</html>

page.html

{% extends 'base.html' %}

{% block css %}
    {{ block.super }}
    {% map_css %}
{% endblock %}

{% block scripts %}
    {{ block.super }}
    {% map_scripts %}
{% endblock %}

{% block content %}
    content...
    {% map_html %}
    content...
{% endblock %}
于 2012-06-27T12:39:33.457 回答