ハウツーは実際に変数をインポート/オーバーライドせずにLESSファイルを参照する

Question

私のウェブページのモバイル版のデスクトップモジュールを再利用しようとしています。すべてのmodule.less参照variables.less - 主にIDE（PhpStorm）のためだけでなく、私が本当に好きな一見で依存関係を持つためにも。

今まで私は、このレッスンルールが実際に参照していると思っていました。実際はそうではありません。ファイルは本当に（1回）含まれていますが、出力はありません（lessドキュメントを参照）。その結果、私のモバイル変数は無効になります。

├ desktop/ 
│ ├ modules/ 
│ │ └ foobar.less 
│ │  > @import (reference) "../variables.less" 
│ ├ main.less 
│ │ > @import "variables.less" 
│ │ > @import "modules.less" 
│ ├ modules.less 
│ │ > @import "modules/foobar.less" 
│ └ variables.less 
│  > @bundle: 'desktop' 
│ 
└ mobile/ 
    ├ main.less 
    │ > @import "variables.less" 
    │ > @import "modules.less" 
    ├ modules.less 
    │ > @import "../desktop/modules/foobar.less" 
    └ variables.less 
     > @bundle: 'mobile' 

モバイルmobile/main.lessをコンパイルした後、結果は、@bundleが'desktop'に等しくなります。

のみ可能 "参照"変数はありませんか？他の提案は歓迎されます。

Answer 1

は最後に、私は非常に簡単な解決策を考え出した：

単にmobile/variables.lessの先頭にdesktop/variables.lessをインポートします。これは、デフォルトのLESSビヘイビアがで一度だけインポートされるために機能します。。それはすでに、すべてのモジュールの前に輸入されているので、デスクトップモジュールの@importルールが（再）インポートが発生することはありません - したがって、任意の変数を上書きすることはありません。

├ desktop/ 
│ ├ modules/ 
│ │ └ foobar.less 
│ │  > @import (reference) "../variables.less" 
│ ├ main.less 
│ │ > @import "variables.less" 
│ │ > @import "modules.less" 
│ ├ modules.less 
│ │ > @import "modules/foobar.less" 
│ └ variables.less 
│  > @bundle: 'desktop' 
│ 
└ mobile/ 
    ├ main.less 
    │ > @import "variables.less" 
    │ > @import "modules.less" 
    ├ modules.less 
    │ > @import "../desktop/modules/foobar.less" 
    └ variables.less 
     > @import (reference) "../desktop/variables.less" 
     > @bundle: 'mobile'