5

サイトの各ページに「共通」の LESS ファイルが含まれ、各ページがページ固有のスタイルを含む別の LESS ファイルを指定できるように、Django プロジェクトのテンプレートを整理しました。

問題は、「共通」LESS ファイル内の変数を参照できるようにするには、ページ固有の LESS ファイルが必要なことです。これを行う最も簡単な方法は、変数宣言を別のファイルに移動し、両方の LESS ファイルで実行できるようにすることだと思いました@import。

ただし、Django アプリは、静的ファイルを格納するために別のディレクトリを使用します。最終的に、ファイルシステムは次のようになります。

- 一般
   - 静的
      -CSS
         - 定義.less
         - common.less
- 他の
   - 静的
      -CSS
         - その他.少ない

との両方common.lessをother.lessインポートする必要がありdefinitions.lessます。この場合、次のcommon.lessように簡単です。

@import "definitions.less";

以下は、LESS ファイルが実際にどのようにページに含まれているかを示したものです。

{% load compress %}
{% load static %}

{% compress css %}
    <link href="{% static "css/common.less" %}"
          rel="stylesheet" type="text/less">
{% endcompress %}

共通の変数定義が両方の LESS ファイルで確実に利用できるようにする最も簡単な方法は何ですか? いくつかの理由から、LESS ファイルの結合を避けたいと考えています。

  • 疎結合 (サイトの残りの部分に影響を与えずにアプリを非アクティブ化する機能) の利点がなくなります。
  • すべてのアプリのすべてのスタイルを取得する必要があるため、1 つのページで取得される追加データが増加します。
4

1 に答える 1

0

We do the same thing in our app -- we have a common file main.less that is included by many of the other less files. However, we dont run into this issue. I think there are a few ways around it-- you could change the location of your static files.

There is a setting in django STATICFILES_DIRS -- and it seems you could change the location of your static files if you want instead of being nested in apps like that. https://docs.djangoproject.com/en/dev/ref/settings/#std:setting-STATICFILES_DIRS

Our code looks like this

{% compress css %}
{% include "_base_css.html" %}
{% endcompress %}

And then _base_css.html just includes all the less files, with our main.less coming first.

## _base_css.html
<link rel="stylesheet" type="text/less" href="{{ STATIC_URL }}css/main.less">
<link rel="stylesheet" type="text/less" href="{{ STATIC_URL }}css/about.less">
<link rel="stylesheet" type="text/less" href="{{ STATIC_URL }}css/dashboard.less">

It's not clear to me from your question what the error is, but I believe your common less file needs to be included before any other less file to be accessible. In your code snippet it doesnt seem like you include that. In terms of compressing, I dont think compressing all of your sitewide css into one file is too bad -- it is one download the first time and then is fully cached.

Hope this was helpful.

于 2014-02-15T10:43:36.153 に答える