Pages

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