條件@import in .less或沒有錯誤當文件丟失

我需要在特定類型的構建過程中有條件地導入文件。使用[email protected]這是對的[email protected]條件@import in .less或沒有錯誤當文件丟失

頂我試了一下迄今...

嘗試使用受保護的混入，以確定構建我需要的類型，即跳過的是，在徹底打破某些減檔進口開發模式。

@isProduction: 1; 

... 

.getImports() when (@isProduction = 1){ 
} 

.getImports() { 
    @import "productionStyles"; 
} 

... 
.getImports();

然而，這似乎失敗，它會嘗試導入和解析productionStyles.less所有的時間。我想保護的mixins不包括@import，那麼你將如何解決？

我也試過

@productionStyles: "productionStyles"; // or 0 

... 
@productionStyles: 0; 


.getImports() when not (@productionStyles = 0){ 
    @import "@{productionStyles}"; 
} 

...

到同用，它會嘗試反正>> FileError: '0.less' wasn't found in ...導入。

我開始認爲這將需要一個更大的重構，其中devStyles和productionStyles都是一件事，我只是在它們之間切換 - 這只是productionStyles是一個除了可由於DEPS和我完全構建後只編譯寧願通過有條件編譯來解決這個問題。

我也可以不用使用grunt-contrib-jshint並編寫我自己的解析器，但希望先探索內置選項。

由於productionStyle.less引用了多個不在文件系統中的文件，是否可以忽略@imports失敗並繼續構建？我寧願不要禁用由於其他地方可能分析器錯誤的所有錯誤的錯誤檢查/休息...

來源

2013-10-14 Dimitar Christoff

爲什麼不在不同的環境中使用不同版本的'productionStyles.less'？ –

我已經解決了使用switch parameter您的問題：

的index.html

<!DOCTYPE html> 
    <html> 
    <head> 
     <title></title> 
     <link rel="stylesheet/less" type="text/css" href="style.less" /> 
     <script src="less.js" type="text/javascript"></script> 
    </head> 
    <body> 
     [foo] 
    </body> 
    </html>

style.less

.mixin(production) { 
    @import "test.less"; 
    background: @color; 
} 

.mixin(dev) { 
    background: green; 
} 

html { 
    .mixin(production); 
}

個test.less

@color: red;

less.js少V1.4.1從project page直接下載。

有關應該導致紅色背景的代碼。切換到html { .mixin(dev); }禁用@import，背景變成綠色。

你的解決方案也有可能工作，但你在HTML或類似的錯誤 - 我沒有檢查過。

來源

2013-10-15 15:48:13

條件@import in .less或沒有錯誤當文件丟失

回答

相關問題