After many months of cave-dwelling and self-imposed anti-societal isolation, I return from the depths of my solitude to humbly (yet proudly) announce the release of Chirpy v2.0!
Now, before I get too carried away here, let me re-divulge the following preface: if you’re completely new to the madness of Chirpy, I recommend that you read about Chirpy’s core features, which were solidifed and released in Chirpy 1.0.0.4. Then, check out the additional features that we added in Chirpy 1.0.0.5. If you’re still not quite convinced that Chirpy will help reinvigorate all of your decompressed hopes and dreams, listen to the almighty David Ebbo wax ornithological about the goodness of the Chirpy Bird. Then, once you’re up to speed, come on back to this almighty post.
Like last time, I’d like begin by tipping my hat to the main Chirpy contributors. Please send them money, Cadbury Eggs, hugs, fresh tulips, etc.: Francis Noel (aka ploufs), Andy Edinborough, Wayne Brantley, and newcomers Martijn Laarman, and Domenic Denicola. I owe them all a huge thank you. They’ve kept this project alive (and uber vibrant) while I was away trying to keep my job and my love life (brown chicken, brown cow) alive, so I can’t thank them enough. If you happen to feel the same affinity for their amazing craftsmanship, please consider donating a couple bucks to the team. If you donate enough wads of cash-money-cash-cash, we’ll release a future version of Chirpy in your honor (eh, Budweiser Chirpy, anyone?).
If you’re teary-eyed or vulnerable to digital persuasion, you can donate to us here:
Bored already? Ignore me, and Download Chirpy now.
Okay, then. Welcome back. Let’s get down to it. In version 2 of Chirpy, we’ve fixed a lot of the bugs that were troubling our fellow Chirpsters. We’ve also added a slew of new mantastic features. We hope you like them:
- CoffeeScript Support
- Offline Google Closure Support
- Uglify.js Support
- JSHint Support
- Inline minification for Razor Views
- The Consolation Prize (Chirpy Console)
Feature 1: CoffeeScript Support
Step 1: Read up on CoffeeScript. You can find out all you need to know on the CoffeeScript homepage. Make sure to check out the thorough documentation, if you’re into that kind of stuff.
Step 2: Add a .chirpy.coffee file to your project.
Step 3: Add some CoffeeScript into your CoffeeScript file.
Step 4: When you save your file, you’ll notice that Chirpy creates .js and .min.js codebehind files. Open those files to see the JavaScript generated from your CoffeeScript. Time to bask in the caffeinated glory:
Feature 2: Offline Google Closure Support
Step 1: Download JRE (Java Runtime Environment) from java.com. You can snag it by clicking here.
Step 2: Install JRE. This can take some time. Consider watching an episode of Law & Order. If you can’t find an episode of Law & Order on TV, you’re probably not trying hard enough. If JRE is still installing, eat dinner. Learn your kids’ names. Hug them. Take a nap.
Step 3: Open Visual Studio. Click Tools > Options > Chirpy > Google Closure Compiler.
Step 4: Select the option to Use Offline Google Closure Compiler. If you’re lucky, Chirpy will automatically find JRE. If you’re not lucky, you’ll have to manually direct Chirpy to the honeypot.
Step 5: Download compiler.jar. You can download it here.
Step 6: Unzip compiler.jar and place the file in your Visual Studio AddIns folder.
Step 7: You’re good to go! When you use gct, your files will be minified locally:
Feature 3: Uglify.js Support
Step 1: Learn about Uglify.js here. If you think it’s the uglifier for you, jump to step 2.
Step 2: Create an .uglify.js file. Save it. And, mung-balls:
Your uglified output is generated. (Insert joke about your boyfriend/girlfriend/husband/wife/fakefriend here):
Feature 4: JSHint Support
Step 1: Learn about JSHint here. Snag the source code from here. Learn about the JSHint quality rules here. If you’re super-bored, check out Crockford’s JSLint from which JSHint is humbly derived.
Step 2: Do something stupid in your chirpy-managed JavaScript file. Like, eh, use the evil eval(). Save your file, and watch JSHint get ornery:
Step 3: If you prefer to be left alone, you can turn JSHint off. To do so, go to Tools > Options > Chirpy > JavaScript, and unselect Run JSHint.
Feature 5: Inline minification for Razor Views
Step 1: In your MVC project, create a new Razor View. Name the view Test.chirp.cshtml.
Step 2: Add some javascript, css, or DotLess to your file:
The Consolation Prize (Chirpy Console)
So, if the visual bling of VS2010 doesn’t strike your fancy, you can now run chirpy from the command line. Keep in mind, though: the console version of Chirpy is still in its early stages infancy, so if you have any ideas/concerns/insights, please fling them my way. Until then, the Chirpy Console shall serve as simple consolation prize (sorry) for the command-line pervs out there.
Step 1: Download the Console Chirpy zip file, here.
Step 2: Unzip the file and place the folder somewhere warm and safe.
Step 3: Pick a directory that you want Chirpy to chew through. For this example, I went with this doozy of a folder:
Step 4: Feed Chirpy the directory.
Step 5: Bask in the darkness. Check out the folder that you chewed through. Your minified files have been created/updated:
Ready? Run over to Codeplex when you’re ready and download Chirpy.
That’s it! Once again, Chirpy says (as always): Happy Coding!
Read More
You can leave a response, or trackback from your own site.
19 Responses to “Maragogype Chirpy: v2, Attack of the Elderly One-Legged Coffee-Bird”
Leave a Reply
In case you missed it. Download chirpy here: http://chirpy.codeplex.com/
Awesome! Going to use it asap! Btw, it’s possible to pass arguments to Coffescript compiler? Especially {bare: true} would be nice..
Excellent work! I’m digging the coffeescript support – now we just need a syntax highlighter for it
You can get half syntax highlighter, just map .coffee extension to Javascript.
Chirpy rocks my sock off!!! Great stuff!
But is there a way to make custom icons for .chirpy.less files?
Did not work for me. After installing the extension when I restart the VS 2010 I get the following error.
The Add-in ‘Chirpy’ failed to load or caused an exception.
Would you like to remove this Add-in?
If you choose yes, the file it was loaded from, ‘\\Shared\Users\Amit\My Documents\Visual Studio 2010\Addins\Zippy.Addin’, will be renamed.
Error Message:
Error number: 80131515
Hi Evan, I just started using asp.net image opimization framework and I thought this will be a great merge into chirpy. I wrote to the asp.net team suggesting a chat with you guys to see if that would be possible. It seems chirpy is flying higher and higher and slowly becoming the “ant” for asp.net web projects. It would be nice if the chirpy team could abstruct out the chirpy execution engine to allow for plug-in’s and extensions. This will allow others to provide their exe file with config specification for chirpy to execut as part of its optimization process. By doing that, asp.net image optimization framework could be pluged-in chirpy nicely. Thanks for all the hard work.
Hi Evan,
congrats for this great stuff.
I’m evaluating Chirpy to integrate it in our projects, and I’m mostly interested in T4MVC integration.
We are already using Combres (http://combres.codeplex.com/) for js/css minification porpouses, and have no plans to change it, as it’s working well for us now.
My question is if we can use Chirpy to auto-build T4MVC templates, and disable the other features, as we make use of Combres. Is that possible?
Thanks in advance,
Sergi
Hey Sergi,
You can disable some of Chirpy’s feature from the Tools > Options menu. And the other features won’t interfere with anything as long as you don’t name the files with any of the Chirp extensions (which you can change from the options menu).
Is that helpful? If you’re looking for T4 automation sans Chirpy altogether, you can check out Wayne Brantley’s initial project, which was consumed into the monstrosity of this project: http://blog.waynebrantley.com/2010/03/t4mvc-add-in-to-auto-run-template.html
Cheers,
Evan
Even!
Nice job on this, as usual. I am having one problem though — since installing the new version, the configuration process doesn’t honor the name I give when combining scripts. It adds a “.min.” after the name. This would be okay, if it were a new project, but I have references all over in many different projects and having to go rename all these is going to be a pain!
Is this an intended feature? Anyway to change it back?!
Thanks,
Jason (@logrythmik)
Great! Great stuff!!! I want to use CoffeeScript in My web application!.I use MVC3 for backend。
Hi Evan,
finally installed Chirpy to run T4MVC and everything is running fine. Great job!
In addition to T4MVC, I’m also using Chirpy to replicate some “web.config” files into all the Views folder for each Area on every build, running a custom T4 template… and it took me to another question:
Can we share Chirpy config with the rest of the team “per solution”? Or has everybody to change his chirpy settings to run the template?
Thanks Evan
I have noticed after installing v2 that .chirp.less files no longer produce both the .css and .min.css version of the file. Is there an option I am missing?
This is great.
Does Chirpy detect whether my project references a dll, for example dotless.Core.dll and use that? Or do I have to wait for a new version of Chirpy before I can use the new features in dotless?
Thanks
How do I set the options for JSHint? See http://stackoverflow.com/questions/6713563/how-do-i-set-jshint-options-using-chirpy
Chirpy gives the error “Object reference not set to an instance of an object.” if an @page rule is used. This does not happen when using the latest dotless library BTW.
@page { margin: 0.5cm; }This tool is really great! I loving it!!! Only one remark. I was testing the compress types.
If you have for example “stylesheets1.chirp.css” and also a “stylesheets1..michaelash.css” the second file won’t get a minimized version. Suggestion is to show a popup.
Thanks anyway!
Let me start off with Chirpy rocks.
However, is there any “real” documentation? I’m specifically looking for examples of using the “mashing” functionality with the FOLDER element but what’s in the links on CodePlex appears to be VERY out of date (especially when compared to the source code). I’m trying to mash together files from throughout our project.
The problem I seem to be having is that it’s trying to mash the mash file (e.g. recursively mashing the file into itself to the point of having to kill my VStudio process). Almost seems like there needs to be an exclude option. Anyway, documentation would be a good thing.
Thanks,
BR
I love the tool. It makes it really easy to combine a base script with either a desktop version or a mobile version for touch devices in order to make an optimized script for each device.
I would like to make one suggestion: Allow combining multiple .less files in the config file before the .less files are parsed. The reason would be theming. For example, I might want to have three different themes and just have 3 different declaration files (e.g. in one theme, @textcolor: black, but in another @textcolor: white). I would combine each of the declarations with a common .less file containing the actual css rules. If there’s a way to do this already, please let me know. Or there might be a better way to achieve the same result.