2013-07-12 25 views
3

我們在MVC4中爲我們的項目使用引導程序。到目前爲止,我們在我們的主佈局頁面中引用了bootstrap.less文件,並且它工作得很好。然而,一個新的需求已經沿着需要我們有我們的每一個部門的網頁定製的外觀(每個部門都有自己的佈局,使用主佈局)使用SquishIt在單獨的較少文件中引用變量(支持動態LESS內容)?

bootstrap.less具有這樣的結構:

@import variables.less //定義

@import別人//像mixins.less全部進口,reset.less等

,因爲我們需要注入我們的變量替代,我們創建了另一個所有變量升ESS文件:

引導,而不-variables.less //包含了所有不variables.less從bootstrap.less

這樣做的原因分離注入我們的變量替代,使得進口我們可以爲我們的頁面定製引導樣式。

我們正在使用SquishIt將較少的文件捆綁到一個包中。

這裏是捆綁:

Bundle.Css() 
    .Add("~/bootstrap/variables.less") 
    .Add("~/variable-override.less") // custom override 
    .Add("~/bootstrap/bootstrap-without-variables.less") 
    .MvcRender("styles_combined_#.js"); 

這並不在所有的工作。如果我在bootstrap-without-variables.less(現在變得類似於bootstrap.less)中刪除了variables.less並且引用它,它就可以很好地工作。

我認爲這個問題是,每個文件都被獨立評估並轉換爲獨立的css,然後再將它們組合在一起。

有沒有辦法告訴打包商首先將文件打包成一個,然後評估並轉換爲css或更好的解決方案來解決這個問題?

回答

2

就像AlexCuse提到的那樣,我沒有辦法只用SquishIt來做我上面提到的。但是,如https://github.com/jetheredge/SquishIt/issues/170中所述,AddString()有一個重載,可讓您添加動態內容較少的內容。

例如,

.AddString( 「LessString」, 「以下」)// .LESS是所述擴展

這隻要LessString不包含工作完全正常任何進口(@import)。所以,我從https://github.com/jetheredge/SquishIt下載了源代碼並開始潛入代碼。通過代碼,我發現通過AddString()加載的內容將CurrentDirectory設置爲我的IIS(「c:\ windows \ system32 \ inetsrv」)的路徑。作爲(要導入的.LESS是 無法找到結尾的文件)。其結果是,進口扔

FileNotFoundException異常

所以,我需要一種方法來設置當前目錄(從那裏我進口將被搜索的參考位置)

這裏是我做過什麼:

STEP1:擴展到資產有一個叫做currentDirectory所

012屬性
internal string CurrentDirectory { get; set; } 

STEP2:增加了第三個可選參數的AddString()超載

public T AddString(string content, string extension, string currentDirectory = null) 
    { 
     return AddString(content, extension, true, currentDirectory); 
    } 

STEP3:更新了AddString()到當前目錄添加到資產

T AddString(string content, string extension, bool minify, string currentDirectory = null) 
    { 
     if (bundleState.Assets.All(ac => ac.Content != content)) 
      bundleState.Assets.Add(new Asset { Content = content, Extension = extension, Minify = minify, CurrentDirectory = currentDirectory }); 
     return (T)this; 
    } 

STEP4:修改BundleBase上的PreprocessArbitary(For Release)以設置當前目錄

protected string PreprocessArbitrary(Asset asset) 
    { 
     if (!asset.IsArbitrary) throw new InvalidOperationException("PreprocessArbitrary can only be called on Arbitrary assets."); 

     var filename = "dummy." + (asset.Extension ?? defaultExtension); 
     var preprocessors = FindPreprocessors(filename); 
     return asset.CurrentDirectory != null ? 
        directoryWrapper.ExecuteInDirectory(asset.CurrentDirectory,() => MinifyIfNeeded(PreprocessContent(filename, preprocessors, asset.Content), asset.Minify)) : 
        MinifyIfNeeded(PreprocessContent(filename, preprocessors, asset.Content), asset.Minify); 
    } 

調試,修改RenderDebug設置當前目錄

if (asset.IsArbitrary) 
      { 
       var filename = "dummy" + asset.Extension; 
       var preprocessors = FindPreprocessors(filename); 
       var processedContent = asset.CurrentDirectory != null ? 
         directoryWrapper.ExecuteInDirectory(asset.CurrentDirectory,() => PreprocessContent(filename, preprocessors, asset.Content)) : 
         PreprocessContent(filename, preprocessors, asset.Content); 
       sb.AppendLine(string.Format(tagFormat, processedContent)); 
      } 

這裏是我的我現在怎麼添加動態或靜態減檔:

.AddString("@import 'content/bootstrap/variables.less';", ".less", AppDomain.CurrentDomain.BaseDirectory) 

對於我的上述要求,我讀的變量。減少到字符串生成器,然後添加我的變量override.less,並最後將bootstrap-without-variables.less添加到字符串生成器。

到目前爲止它已經爲我工作。我測試了以下情況:

  1. 正常情況下導入的文件較少,例如.Add("~/content/styles.less")
  2. 沒有進口的內聯減少,例如, .AddString(LessString, ".less")
  3. 動態減少導入的文件,例如.AddString("@import content/bootstrap/variables.less';", ".less", AppDomain.CurrentDomain.BaseDirectory)

    我會盡快做出拉取請求。我希望這可以幫助那些希望通過導入來支持動態LESS內容的人。

+2

很高興你的工作!期待看到您的拉動請求,這將是一個偉大的事情補充。所以你知道,搞亂Environment.CurrentDirectory可以帶來一些有趣的後果,所以它很好地以某種方式來限制變化。您可能想要使用此類將執行給定目錄中的代碼,然後恢復以防止不穩定:https://github.com/jetheredge/SquishIt/blob/9d45fd53bde37d610d49a6fea31b3150897c5676/SquishIt.Framework/Files/DirectoryWrapper。cs – AlexCuse

+1

我剛剛提交了一個拉取請求,隨着還原的變化。 https://github.com/jetheredge/SquishIt/pull/246 –

+0

非常感謝! – AlexCuse

1

你是對的,SquishIt在合併文件之前做的處理較少。沒有辦法只用SquishIt來問你的問題,但我想你可以在你自己的路上合併文件(使用.AddString方法將你最終的無內容添加到包中)。其中一種選擇可能更適合您的需求,我不確定。

+0

我將.less文件讀入字符串,並使用.less擴展名嘗試.AddString重載。但是.less文件中的導入現在還沒有找到。 –

+0

嗯,這是有道理的。它看起來像你正在使用的變量覆蓋文件的靜態引用 - 如果這是你的實際使用情況,我認爲你可以只使用修改variables.less文件。如果沒有,您可能需要提出自己的解決方案(除非其他優化庫中的一個支持您需要執行的操作)。 – AlexCuse