16

私はLESSのアイデアとコンセプトが本当に好きです。それでも私はバグに遭遇しました。それはかなり前に著者に報告しましたが、まだフィードバックを受け取っていません。たぶん、何か間違ったことをしているのは私だけです。

application.lessこれに似た私のファイル：

@import "reset";
@import "config";
@import "header";
@import "forms";
[…]

@importルールを使用してファイルを分割し、css-declarationsの概要を把握できるのが気に入っています。ただし、インポートしたすべてのファイルは、config.less-Fileを再度インポートして、そこで定義したミックスインと変数を利用できるようにする必要があります。

私が運転している冗長性の種類についてはすでにご存知でしょう。config.lessがインポートされるたびに、その「出力」はapplication.cssの一部になります。

私の設定ファイルには約200行のコードが含まれています。CSSを（コントローラー名に基づいて）約5つのファイルに分割し、構成を再インポートする必要があるため、100％冗長な約1000行の生成されたCSSコードが作成されます。

私が思いつくことができる唯一の解決策は、ファイルを分割しないことです。これは私が本当に避けたいことです。

4

4 に答える 4

12

理想的ではありませんが、理論的にインポートするファイルに CSS を含める必要がないという実際的な理由があります。通常、CSS 出力に寄与しない変数と動的 mixin があります。

lib.less:

#colors {
    @blue: #0011ff;
    @red: #ee2222;
}
.button (@width: 10px) {...}

main.less:

@import "lib";

a { color: #colors[@blue]; }

出力、main.css:

a { color: #0011ff; }

#colors {} and .buttonこの場合は出力されません。

于 2010-01-25T23:01:17.917 に答える
3

LESS がサポートされるようになりました@import-once "stylename.less";

于 2012-10-30T11:57:03.590 に答える
0

ライブWebサーバーにデプロイするときに、開発環境でそれらを分割してから、すべての追加コードを必要とせずにマージできるかもしれません。

于 2010-01-25T12:55:51.443 に答える
0

動的ミックスインが宣言されていて、$代わりに..

config.less では:

$mixin
{
  a { color: @light; }
  h2 { //etc.
}

header.less で:

@import "config";
.header
{
  $mixin;
}

ソース。私もこれを試しましたが、うまくいきます。

于 2010-12-15T21:53:04.590 に答える