如何使用Web Essentials將LESS文件包含在網頁中？

我已經安裝了web essentials 2013，並且爲了測試目的創建了一個默認的MVC項目來嘗試LESS功能。如何使用Web Essentials將LESS文件包含在網頁中？

我刪除了所有的引導CSS文件，我把一個名爲less文件夾內Content所有的bootstrap的.less文件，但是當我用鼠標右鍵單擊他們web essentials菜單都是灰色的，它不編譯任何東西。 .. 如何使用Web Essentials自動編譯在網頁中包含更少的文件。那可能嗎？

網絡要領的設置如下：

"Less": { 
    "CompileOnBuild": true, 
    "CompileOnSave": false, 
    "EnableChainCompilation": true, 
    "GenerateSourceMaps": true, 
    "MinifyInPlace": false, 
    "OutputDirectory": "css", 
    "ProcessSourceMapsForEditorEnhancements": true, 
    "ShowPreviewPane": true, 
    "StrictMath": false 
}

來源

2015-06-14 CodeArtist

我使用網絡必需品，但不要打擾編譯。我只是添加'less.js'文件（用於在瀏覽器中編譯）並引用'styles.less'（或任何你所稱的）。通過這種方式，任何使用項目（團隊中的另一成員）的人都不會使用Web Essentials，它將始終具有編譯文件 –

@RobScott嗯...... [用於生產]（http://lesscss.org/#客戶端使用率）？ – EdSF

正是我所說的。只是爲了生產你要做的是將LESS文件（我使用WinLESS）編譯到CSS中（或者使用我猜測的Web Essentials），註釋掉JS文件和LESS文件，並取消註釋主CSS文件或min.css）。我相信有更簡單的方法來做到這一點，這就是我的團隊和我做的B/C他們不使用網絡必備 –

只需配置Web要點彙編關於保存和建設。這樣，您總是可以通過保存LESS文件來手動生成CSS。

LESS Options

您可以選擇配置Web要領來縮小生成的CSS：

CSS Options

另外補充它加載生成的縮小的CSS文件StyleBundle：

bundles.Add(new StyleBundle("~/bundles/css").Include("~/Content/bootstrap.min.css"));

來源

2015-06-14 23:16:43 Nicholas

謝謝但是，菜單仍然是灰色的... – CodeArtist

對我來說，Web Essentials只需在更改LESS時更新CSS的背景上工作。 – Nicholas

如何使用Web Essentials將LESS文件包含在網頁中？

回答

相關問題