2

在 Django 中将相关文件保存在一起的最佳方法是什么？

除了我们的 HTML 模板之外，大多数视图至少还有一个附加的 JavaScript 文件，可能还有一个附加的 CSS 文件。例如：

  • item_detail.html
  • item_detail.js
  • item_detail.css

如果可能，我们希望将这些文件并排保存，因此我们不必在两个或三个目录中查找它们。

更新：我知道打败缓存是愚蠢的，这不是我要问的。每个页面加载几个正确缓存的 JavaScript 和 CSS 项。例如：

<!-- at top of file -->
<link rel="stylesheet" href="/master/css/site-main.css">

<!-- at bottom of file -->
<script type="text/javascript" src="/master/js/jquery.js"></script>
<script type="text/javascript" src="/master/js/site-main.js"></script>

那部分很好。

除此之外，每个页面都会加载页面特定的JavaScript 和 CSS：

<link rel="stylesheet" href="/static/css/widgets/item_detail.css">
<script type="text/javascript" src="/static/js/widgets/item_detail.js"></script>

在此示例中，item_detail.js将具有项目详细信息页面上需要的事件处理程序（仅）。

不幸的是，这意味着我现在有几个用于此视图的并行目录结构：

  • my_site
    • widgets
      • item_detail.html←这是视图
    • static
      • css
        • item_detail.css←这是特定于视图的 CSS
      • js
        • item_detail.js←这是特定于视图的 JavaScript

我想要的是这样的：

  • my_site
    • widgets
      • item_detail.html←这是视图
      • item_detail.css←这是特定于视图的 CSS
      • item_detail.js←这是特定于视图的 JavaScript

由于视图在 Django 中的工作方式，我不清楚这是可能的。

4

5 回答 5

1

如果您只是为了开发而组织东西，您可以将模板目录与所有模板、css 和 js 文件符号链接到您也提供静态文件的目录。

因此，从您的示例中：将 my_site/widgets 添加到 Django TEMPLATE_DIRS 配置，并将 cp -s my_site/widgets 添加到您拥有静态文件的目录。

这是肮脏的黑客，请不要在生产中使用它，因为它非常不安全恕我直言。但是，如果您想在开发阶段组织整齐的项目 - 那么我认为这是一种可能的解决方案。

并且还要考虑到当你从开发转向生产时，这可能会让你头疼，因为东西会失败。

于 2009-08-17T17:42:50.440 回答
0

我同意freiksenet。他解决的问题的解决方案可能是聚合各种 css 和 js 文件。然后整个站点只使用一个 css 和一个 js 文件。是的，第一个负载会更高，但是站点速度的很大一部分在于下载文件，如果缓存做得正确，这些文件的聚合有助于恕我直言。

不幸的是，我没有回答你的主要问题。

于 2009-08-17T17:22:00.000 回答
0

我将javascript保存在按函数分隔的文件中，并将它们组合成一个带有预提交钩子的缩小的js文件（在测试运行之后）。

例如：我目前正在处理的网站上有几个 jquery-ui 对话框。每个对话框的功能都被分解成它自己的 js 文件以实现可维护性。并且所有需要的 js 文件都使用一个简短的 base.js 文件“包含”在开发页面上，如下所示：

function include(filename) {
    document.write(unescape("%3Cscript src='" + filename + "' type='text/javascript'%3E%3C/script%3E"));
}

// include-js (external)
include('/site_media/jquery-plugin1.js');
include('/site_media/js-sources/dialog1.js');

我的预提交钩子在这个文件上做了一个正则表达式......

include\('/site_media/(.*)'\);

并将所有文件输入 YUI 压缩器。

所以我想你的问题的答案是......我把它们放在任何对我来说合乎逻辑的地方，因为在实时网站上，无论如何它都会在缩小的 JS 文件中

于 2009-08-17T17:28:35.120 回答
0

您不希望将模板作为静态文件提供——它们可能包含不适合公众查看的敏感信息或有关页面实现的详细信息。

CSS 和 JS 不必分离到单独的目录中——只需将它们放在static/目录中即可。

  • my_site/
    • widgets/
      • item_detail.html
    • static/
      • item_detail.css
      • item_detail.js
于 2009-08-17T17:50:21.503 回答
0

我正在测试的一种方法：

  • my_site/
    • widgets/
      • item_detail.html
      • item_detail.css
      • item_detail.js

这些不是静态共享的。相反，在 HTML 模板中：

<script type="text/javascript" charset="utf-8">
    {% include "widgets/item_detail.js" %}    
</script>

（CSS 的类似代码。）我只会对特定于页面的JavaScript 和 CSS 执行此操作，而不是可以从缓存中受益的站点范围的内容。

这会将实际的 JavaScript 和/或 CSS 直接转储到模板中，但允许我将它们保存在单独的文件中以用于开发目的。这在开发方面很好，但会破坏一些 JavaScript 和 CSS 缓存，但仅适用于不会在任何其他页面上重复使用的页面级内容。

于 2009-08-17T18:05:24.857 回答