CODEWITHSUNDEEP
cssasp.net-mvcrazorsassless
olemarius
olemarius

Reputation: 1134

.LESS together with Razor

Is it possible to use Razor View Engine (ASP.NET MVC) together with .LESS (similar to SASS - http://lesscss.org/ for .NET), since they're both using "@blah"?

What I want to achieve is to create .LESS css files, mixed with Razor.

UPDATED:

Sorry for being a bit unspecific. What I want to do is to use Razor View Engine WITHIN the .less (dotlesscss) css files. This would be nice in order to e.g. pass site-settings like Theme customized from an admin into the css file.

Problem is that the syntax will crash.

An alternative is to use C# or some other View Engine instead.

Upvotes: 8

Views: 9114

Answers (3)

Michael
Michael

Reputation: 3426

.NET 4.5 and MVC 4 now has this out of the box

http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification

Upvotes: 2

jessegavin
jessegavin

Reputation: 75650

You should consider using Justin Etheredge's SquishIt library. Not only does it include the dotlesscss library, it will combine and minify your CSS and Javascript with ease!

Here's an example of how I use SquishIt in Razor.

The following code will combine, minify and LESSify all the CSS files referenced into one CSS file. It will do the same with the Javascript files.

@MvcHtmlString.Create(
  SquishIt.Framework.Bundle.Css()
    .Add("~/media/css/reset.css")
    .Add("~/media/css/style.less")
    .Add("~/media/css/handheld.css")
    .Render("~/media/css/combined_#.css"))

@MvcHtmlString.Create(
  SquishIt.Framework.Bundle.JavaScript()
    .Add("~/media/js/geo.js")
    .Add("~/media/js/jquery-1.4.4.js")
    .Add("~/media/js/jquery.unobtrusive-ajax.js")
    .Add("~/media/js/jquery.validate.js")
    .Add("~/media/js/jquery.validate.unobtrusive.js")
    .Render("~/media/js/combined_#.js"))

Output looks like this:

<link rel="stylesheet" type="text/css" href="/media/css/combined_312454.css" />
<script type="text/javascript" href="/media/js/combined_312454.js"></script>

UPDATE (Over 1 year later)...
Another project you might want to look at is Cassette which pretty much does everything SquishIt does (and more).

Upvotes: 23

Pierre-Alain Vigeant
Pierre-Alain Vigeant

Reputation: 23083

LESS and the Razor engine are not related.

If you are interested in using LESS, check out dotlesscss. See its Git repository and wiki. For some reason, its main website is down since august and they haven't brought it back up.

Upvotes: 3

Related Questions