Monday, May 4, 2015

Bundling LESS files for your ASP.NET MVC Web Projects

If you are using LESS files in your ASP.NET MVC Project, you will definitely want to take a look at this article which describes how to perform bundling of your LESS files: http://www.asp.net/mvc/overview/performance/bundling-and-minification

Of course, after reading this article, I discovered that there was a much easier way to provide Bundling to my ASP.NET MVC Project through a very handy NuGet package: System.Web.Optimization.Less: https://www.nuget.org/packages/System.Web.Optimization.Less/

The syntax is incredibly simple and more inline with creating Stylesheet Bundles in general:  https://github.com/scott-xu/System.Web.Optimization.Less



You simply include something like the following in your BundleConfig.cs file:
BundleTable.Bundles.Add(new LessBundle("~/Content/bootstrap").Include(

  "~/Content/less/bootstrap.less",

  "~/Content/less/responsive.less"));
 
 


To include the bundle in your ASP.NET MVC Razor View, you then simply add the following:



@Styles.Render("~/Content/bootstrap")


This article also does a great job of going into greater detail about how to use LESS Bundles in your ASP.NET MVC Web Project: http://www.brendanforster.com/blog/yet-another-implement-less-in-aspnetmvc-post.html

No comments:

Post a Comment