Thursday Night

Paul Betts’s personal website / blog / what-have-you

SassAndCoffee hits 1.0!

What does SassAndCoffee do?

SassAndCoffee is a library for ASP.NET (both MVC and old-school WebForms) that adds drop-in support for two new languages: Sass and SCSS, a language that allows you to write reusable, more structured CSS, as well as CoffeeScript, which is a JavaScript dialect that is much more syntactically elegant, but still preserving 100% compatibility with regular JavaScript.

How to use SassAndCoffee

  • Add the package reference via NuGet
  • Add a .coffee, .scss, or .sass file to your project (an easy test is to just rename a CSS file to .scss)
  • Reference the file as if it was a CSS or .JS file (i.e. to reference “scripts/test.coffee”, you should reference “scripts/test.js” in your SCRIPT tag)
  • To get the minified version of a file (either a coffee file or a standard js file), ask for the “.min.js” version (i.e. “scripts/test.min.js”)

What’s New in SassAndCoffee 1.0 – Rigging VS2010 to be compatible

The most common issue that people experience with using SassAndCoffee wasn’t actually an issue with the code at all – the symptoms were that it would work fine on their development machine, but when they deployed to production, all the SCSS/CoffeeScript files would return 404 File Not Found.

Why? Since VS2010 doesn’t recognize these files, it sets its build action to ‘None’, which means the files won’t be deployed. However, since VS runs your app locally from the same directory, it would still find the files on your box. The ultimate case of “Works On My Machine”!


The Properties Dialog, where you can reset this property

Well that’s annoying. How do you fix it?

Now, when you install SassAndCoffee, you will see a dialog offering to install a file onto your box – this “pkgdef” file will configure VS to consider Sass/SCSS/Coffee files as Content. Here’s the details on how this works.

Configurable Caching Support

SassAndCoffee now has three types of cache options, which can be configured by adding a setting to the appSettings block with a key of SassAndCoffee.Cache:

  • NoCache – Compile every file when requested, don’t cache anything
  • InMemoryCache – Cache a limited number of files in-memory, but don’t persist anything to disk
  • FileCache – The default option (and previous behavior) – cache compiled files in App_Data

What else is new?

  • SassAndCoffee had its first external contributions by Steven Robbins and Ken Browning! You have no idea how excited I am about this.
  • The biggest change was support for NancyFx by Steven’s Herculean effort to decouple the core compilation code from the ASP.NET pipeline. SassAndCoffee is now in a great place for other non-ASP.NET frameworks to use as well, such as Manos.

Written by Paul Betts

July 12th, 2011 at 10:23 pm