BundleTransformer：未綁定的CSS通過@import指令

我們在我們的ASP.NET MVC項目中使用BundleTransformer來捆綁我們的樣式文件。BundleTransformer：未綁定的CSS通過@import指令

這很好用，但我們注意到一些CSS文件並沒有與我們的LESS文件捆綁在一起，當我們用少量的重要文件將它們放入@import CSS at-rule時。

樣品在我們的根LESS文件：

/* Import core LESS files */ 
@import "../core.less"; 

/* Import jQuery UI stuff*/ 
@import "../themes/base/core.css"; 
@import "../themes/base/resizable.css"; 
@import "../themes/base/accordion.css"; 
@import "../themes/base/tabs.css"; 

/* Import more LESS files */ 
@import "../morestyles.less";

如果我們看看那些從Chrome中下載的文件，很顯然的是，CSS文件不與根LESS文件捆綁在一起。

Chrome Network Screen Capture

當然，我們可以簡單地包括在BundleConfig這些CSS文件，並刪除@import電話，但我只是好奇，想看看是否有辦法讓它們捆綁在一起。

來源

2015-05-04 André Hauptfleisch

http://stackoverflow.com/questions/9593254/mvc4-less-bundle-import-directory ..可能有幫助。 http://www.nuget.org/packages/BundleTransformer.Less – 2015-05-04 10:16:13

@gerdi：謝謝，但我們已經在使用BundleTransformer.Less軟件包了。如果我們不這樣做，捆綁根本無法奏效。 –

啊對，對不起 – 2015-05-04 11:42:41

您應該閱讀http://lesscss.org/features/#import-options。

在您的代碼@import "../themes/base/tabs.css";編譯爲@import "../themes/base/tabs.css";（由於.css擴展名）。哪一個是「正常」的CSS導入，CSS導入需要額外的HTTP請求來加載。

可以使用inline選項：

@import (inline) "../themes/base/tabs.css";

上述行內從tabs.css代碼到您的項目文件，但不處理它。

來源

2015-05-05 13:46:08

傳說！所有的低音現在屬於你。謝謝！ –

BundleTransformer：未綁定的CSS通過@import指令

回答

相關問題