如何引用模塊化LESS文件中的全局變量？

如何在模塊不直接引用variables.less時引用在單個module.less文件中的中央variables.less文件中定義的變量？如何引用模塊化LESS文件中的全局變量？

這是我的風格的文件夾結構：

Styles 
    _variables.less 
    Site.less 

    Modules 
    _forms.less 
    _navbar-top.less 
    _panels.less 
    _titlebar.less 
    Modules.less 

    Pages 
    _page1.less 
    _page2.less 
    Pages.less

文件Site.less基本上是這樣的：

@import "_variables.less"; 
@import "Modules/Modules.less"; 
@import "Pages/Pages.less";

（只包括資本減檔）

和模塊.less看起來像：

@import "_forms.less"; 
@import "_navbar-top.less"; 
@import "_panels.less"; 
@import "_titlebar.less";

（它只在同一個文件夾中包含下劃線前綴的文件）

Pages.less的結構相同。

我想要做的是有在modules/_panels.less文件中的以下內容：

.panel-form { 
    .panel-variant(1px; @text-color; @component-default-bg; 1px); 
    border-top: solid darken(@component-default-bg, 1px); 
    border-bottom: solid darken(@component-default-bg, 1px); 
    border-left: none; 
    border-right: none; 
}

但當然我LESS編譯器（Visual Studio中的Web要點2013.5）拋出一個錯誤，並拒絕編譯文件_panels.less，因爲它引用的變量不在的範圍內。

目前我的解決方法是在Site.css中聲明.panel-form，但這是一種破解 - 我不想在那裏聲明任意數量的模塊。

是否有可能引用像這樣的變量，仍然編譯爲CSS，如果是的話如何？如果不是，我應該使用更好的結構嗎？

順便說一句，我注意到LESS編譯器不喜歡Bootstrap，因爲如果我在Bootstrap LESS文件中輸入一個空格，它會引發錯誤，例如， navbar.less並嘗試保存它，報告（對於navbar.less）mixin .clearfix()未定義。當然這是因爲navbar.less沒有引用mixins.less，但如果它可以從bootstrap.less向下編譯，那麼一切都會正常工作...

來源

2015-10-07 DaveCan

你需要的是配置WE編譯該項目主文件而不是文件你編輯/保存。例如。請參閱http://stackoverflow.com/questions/19213067。 –

@ seven-phases-max謝謝，但我沒有看到任何關於編譯主文件的答案。有一些WE引用忽略帶有大寫下劃線的文件。所以我猜測也許我應該將像Module.css這樣的文件改爲_modules.css或類似文件，這樣它就不會嘗試編譯。明天早上會試試。或者我錯過了什麼？我如何配置你提到的方式？再次感謝。 – DaveCan

http://stackoverflow.com/a/19213447 –

我不知道你的環境是什麼，但三重斜線指示它通常工作：

根
少
- - _ VARS。少
- - 模塊
- - - someModule.less

內部「someModule.less」你應該試試這個：

/// <reference path="../_variables.less" />

來源

2017-07-04 13:36:17

如何引用模塊化LESS文件中的全局變量？

回答

相關問題