How do I enable LESS files on a web page using Web Essentials?

I installed web essentials 2013 and I created a default MVC project for testing to try LESS.

I deleted all the bootstrap CSS files and I put a folder named less

inside Content

with all the files bootstrap

.less

, but when I right click on them the menu is greyed web essentials

out and it doesn't compile anything ... How to include fewer files inside an auto-compile webpage with help web essentials

. Is it possible?

The web site settings are as follows:

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

      

+3


source to share


1 answer


Just set up your web components to compile on save and build. This way, you can always manually generate CSS by saving the LESS file.

LESS Options

Optionally, you can customize Web Essentials to minify the generated CSS:



CSS Options

Also add StyleBundle

which loads the generated minicss file:

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

      

+1


source







All Articles