---

Update: Chirpy has new features, and you can download the source code from Codeplex. So, once you’re finished reading this, head on over to this post.

---

You’d think minification would be a lot cooler and easier. Like, say, Honey, I Shrunk The Kids. But, alas.

Wayne Brantley released a nice DotLess translator a couple months ago. Before that, Phil Haack created a nice T4 template for mashing and minifying DotLess, Css, and Js files. Today, in the spirit of my Zippy Series, I’ve enhanced (or deprecated [on?]) Wayne’s creation with a couple of new features, which I’ll discuss briefly below.

Before you get too frisky, make sure to download Chirpy Zippy here.

Also, if you’re new to working with Visual Studio AddIns, or if you just need a little help installing Chirpy Zippy, feel free to check out the instructions page. It shouldn’t take you more than a couple of minutes to set Zippy up.

And now, drum roll, shock and awe, get naked please, or sit there, and let’s just get right down to business. The business: for starters, assuming we’ve already added Chirpy Zippy to our AddIns folder, let’s put it to good use. Add a new javascript file to your project. We’ll call it hello.chirp.js. Adding the “.chirp.js” suffix to our filename is Zippy’s cue to look after the file. Quickly, you’ll notice that our new javascript file has a “codebehind” file. Ah, snap:

Now, whenever we make modifications to our javascript file, the “min.js” version of the file will–you guessed it–be a minified file that we can use however we see fit. If you’re wondering, Zippy uses the YUI Compressor to do his compressing.

Zippy also fondles stylesheets. For example, create a stylesheet called “hello.chirp.css,” and (..if you can’t see what’s coming here, I fear for your children) voila:

Zippy also handles .less files. For example, add “howdy.chirp.less” to your project, and you’ll get both a minified and a non-minified css file. Not too shabby:

What about mashing? Add as many .chirp.config files to your project as you want. In the config file, you can specify file groups. You can also specify which files get minified:

<root>
    <FileGroup Name="group1.js">
        <File Path="jquery-1.4.1.min.js" Minify="false" />
        <File Path="jquery.json.js" />
        <File Path="MicrosoftAjax.js" />
    </FileGroup>

    <FileGroup Name="group2.js">
        <File Path="jquery-1.4.1.min.js" Minify="false" />
        <File Path="jquery.json.js" />
    </FileGroup>

    <FileGroup Name="group1.css">
        <File Path="../Styles/jquery-ui-1.8.custom.css" />
        <File Path="../Styles/colorbox.css" />
        <File Path="howdy.chirp.less" />
    </FileGroup>
</root>

Saving the above config file results in the following outputted files:

Think that’s it? Nope. If you’re super-lazy, you can mash together all of the files in a folder:

<root>
    <FileGroup Name="main.scripts.js">
        <Folder Path="/" Type="*.min.js" Minify="false"/>
        <File Path="MicrosoftAjax.js" />
    </FileGroup>
</root>

—

Now For The Kind Of Warning You Put On Things That Could Really Hurt People

This project isn’t perfect, but it works. Yes, it works well enough that I’m not completely ashamed of it.So, that said, if there’s any amount of interest in extending this project, or increasing its stability, or destroying it, maybe Wayne could be enticed into helping me throw together a code project (eh, eh?) or something. Some way for others to fix things for me? I have beers to drink. Please? Help?

Anyways. It’s late. It’s Friday. And I’m done fiddling.

Must. Stop. Ignoring. Family. And. Wife.

Read More

• The Joys of Chirpy Zippy : How To Install (7)
  Let's start with the obvious. Adding Visual Studio AddIns. First, open your My Documents/Visual Studio folder (for me, it's "C:\Users\Evan\Documents\V...
• Chirpy Has a New Cage (and New Features!) (1)
  Already know sir Zippy biblically? Well, then. Due to overwhelming demand (and a deadly case of the avian bird flu), Chirpy (aka Chirpy Zippy) is now ...
• Chirpy Attains Godlike Bird-Power In Version 1.0.0.4 (26)
  Let's start with the simplest part: download Chirpy at codeplex. Start fiddling around. If something doesn't work complain about it. If something does...