First, make sure you have the following NuGet packages installed:
In the RegisterBundles(BundleCollection bundles) function of the BundleConfig class, add this block of code:
var nullOrderer = new NullOrderer();
var css = new CustomStyleBundle("~/Content/less").Include("~/Content/bootstrap/bootstrap.less");
css.Orderer = nullOrderer;
Be sure to include the new bundle in the <head> tag of your layout view:
Also, some changes will need to be made to the configuration/bundleTransformer section in the Web.config. The defaultMinifier will need to be set for css and js minification and the less/jsEngine property will also need to be added.
<jsEngine name="MsieJsEngine" />
When you are testing this setup, it may be helpful to add the following line to the end of the RegisterBundles function in your BundleConfig if you’d like to verify the minification process in a development environment:
BundleTable.EnableOptimizations = true;
Remember that you can also control which environments are deployed with the minified versions versus the original LESS files by using Web.config Transformation Syntax:
<compilation debug="true" />
<compilation xdt:Transform="RemoveAttributes(debug)" />
Update: As Andrey pointed out in the comments, it is unnecessary and not recommended to use both BundleTransformer and CssMinify. After verifying that the code still minified the CSS correctly, I have updated the post to include the update the code.
Update: Andrey pointed out that since ScriptBundle and StyleBundle already use transformations, it is recommended to instead use the Bundle Transformer class “CustomStyleBundle”. Also, when switching to the recommended CustomStyleBundle, I noticed the LESS code wasn’t minifying anymore (although it was compiling to CSS), so I added the BundleTransformer.MicrosoftAjax NuGet package to minify the translated LESS and specified in the <bundleTransformer> section of the Web.Config the MicrosoftAjax adapters as the defaultMinifiers. I edited the post to update the code sections and the explanations.