How to ignore certain LESS files in Web Essentials LESS compiling? (Bootstrap)

Question

I've set up Web Essentials 2013 (in Visual Studio 2012) and loaded in the default Twitter Bootstrap LESS source files. Auto-build and minification is working perfectly, except Web Essentials quite overdoes the job. When I select "bootstrap.less", make a change and save it, Web Essentials creates a new "bootstrap.css" as well as a "bootstrap.min.css" with everything inside I need. But when I edit e.g. buttons.less, it creates a buttons.css (and buttons.min.css) too (with all the includes and mixins). Which means, in fact, I'll have nearly the same css files over and over again under different names.

Can I declare certain files to be ignored on save?

Answer 1

Okay, I figured it out.

What I initially wanted was LESS compilation on build, Web Essentials was so kind to do this on save. To deactivate this, in Visual Studio 2012 head over to Tools -> Options -> Web Essentials -> LESS and deactivate "Generate CSS file on save".

According to the Visual Studio Extension page for Web Essentials, minification on build works not by now, but will on future releases. I have to delete the .min.css files by myself and create it again on every build as it seems. :(

Pro-tip for every dev:

If you use any framework, tools, extensions etc. and your new super-powers don't work as expected, don't blame the extension, shut up and do it yourself.

Answer 2

There is a convention in Web Essentials that if the name of your less file starts with an underscore (like _utils.less) it will not be compiled to css on save.

https://webessentials.uservoice.com/forums/140520-general/suggestions/3319359-don-t-compile-nested-less-files

Answer 3

Although what @corvuscorax says is absolutely true what I do (if you don't like the idea of starting your file names with an underscore) is to create a folder starting with a #

This seems to stop webessentials from compiling your less.

Note that Visual Studio won't let you create a folder with a starting hash so you will have to create it using your Windows Explorer and then add it to your project via visual studio.

Answer 4

For ignoring only files, you can use underscore at the file name.

Web Essentials has an internal convention whereby files beginning with an underscore will not be saved to CSS.

This is actually quite useful. You don’t want your variables.less or mixins.less files being saved as variables.css or mixins.css. So in this case, name them _variables.less and _mixins.less. They will be compiled (and thus checked for correct syntax) but won’t take up space on disk or in source control as redundant CSS files.

https://medium.com/@brendaningram/web-essentials-not-saving-css-files-a450b8c2d23a

Answer 5

There is a way to keep your filenames and prevent WebEssentials from compiling your LESS at the same time. Create .weignore file with filenames or masks for ignored files as described in the docs.