12 Comments

As documented in recent posts, I've been tinkering getting the LESS and CoffeeScript compilers running on Windows Script Host. I've now got round to wrapping these up as ASP.NET HTTP Handlers so you can easily use them in ASP.NET-based websites. You simply reference the *.less and *.coffee files and they get served up as CSS and JavaScript directly. For example:

<link href="content/style.less" rel="stylesheet">
<script src="content/site.coffee"></script>

No need to install add-ins into Visual Studio or add build steps to your project. The main downside is that it won't run on non-Windows platforms under Mono (although I'm tempted adapt it to use Mozilla's SpiderMonkey JavaScript Shell).

If you're running Visual Studio 2010 then simply use the LessCoffee NuGet package.

PM> Install-Package LessCoffee

If you're using Visual Studio 2008 you'll need follow these manual steps:

  • Copy LessCoffee.dll to your web application's /bin directory
  • Add the following entries to your web.config file:
    <system.web>
        <httpHandlers>
            <add path="*.coffee" type="DotSmart.CoffeeScriptHandler, LessCoffee" verb="*" validate="false"/>
            <add path="*.less" type="DotSmart.LessCssHandler, LessCoffee" verb="*" validate="false"/>
        </httpHandlers>
    </system.web>

    <!-- IIS 7 -->
    <system.webServer>
        <validation validateIntegratedModeConfiguration="false"/>
        <handlers>
            <add path="*.coffee" type="DotSmart.CoffeeScriptHandler, LessCoffee" verb="*" name="DotSmart.CoffeeScriptHandler"/>
            <add path="*.less" type="DotSmart.LessCssHandler, LessCoffee" verb="*" name="DotSmart.LessCssHandler"/>
        </handlers>
    </system.webServer>

If you're using Windows 2003/IIS 6 then you will need to map the file extensions *.less and *.coffee to aspnet_isapi.dll.

The source is on GitHub, obv: https://github.com/duncansmart/LessCoffee

Comments

Comment by GeorgeR

Hi Duncan,

I was getting sick of duplicating entries all over the place to apply my theme to jqueryUI, so i hit up nuget and typed in "less css" on a whim - and there you were! Worked from the get-go - filled in my config file and everything. Thanks!

GeorgeR
Comment by GeorgeR

While trying to include the jquery-ui theme (by renaming it with a .less extension) so that I could extend/mix some things, I found 2 hickups that prevented it from compiling.

1) .ui-widget { font-family: "\"Segoe UI\"", Helvetica, Arial, Sans-Serif;
font-size: 9pt; }

Getting rid of the "\" on either side of Segoe UI fixed it.

2) The datepicker IE fix:

display/**/: block; /*sorry for IE5*/

Got rid of the /**/ and it was fine.

GeorgeR
Comment by Duncan Smart

Hi - I've responded on StackOverflow!

Comment by Duncan Smart

All fixed now - it was a bad update :-( I need better tests! Update to 1.0.3.2 from Nuget.

Comment by Duncan Smart

Andrés, can you send me style.less.css (gmail: duncan.smart), to see if I can work out the issue?

Comment by Duncan Smart

Try browsing to the .less file directly to see if there are any errors being generated. Let me know white they are.

Comment by Andrés Valera

Here the results

/* Generated by DotSmart LessCoffee on 30/11/2011 4:39:20 PM - http://dotsmart.net */
/* Using LESS - Leaner CSS v1.1.5 - http://lesscss.org - Copyright (c) 2009-2011, Alexis Sellier */


/* Error in style.less.css: */

Comment by Andrés Valera

Hi Duncan,

Thanks for creating this package. I installed and remove the less.js but the page look like it has no css. I'm not sure that I'm missing.

I see all the entries in the web.config and the reference to the dll.

Any clue?

Comment by Duncan Smart

Robert, if you're using Visual Studio 2010 or later, just use the Nuget Package Manager (http://nuget.org/)

Comment by Robert Kuzelj (@kuzrob)

Where do I find the LessCoffee.dll?
I am working on a pretty old version of IIS