JavaScript Module Visual Studio Template


Posted on Sunday August 2011


As I suck a bit at JavaScript I have made a little template to help organize things. Visual Studio does not help very much - create a new JavaScript file and what do you get? Not very much, that's what.

You can copy this into C:\Users*yourname*\Documents\Visual Studio 2010\Templates\ItemTemplates\

Then when you add a new item in a c# project :

alt text

It will create a JavaScript module: (notice the file name gets replaced into the script!)


    var helloWorld = (function() {

       "use strict";

       $(function() {
              init();
       });

       function init(options) {

       }

       return {
              init: init
       };

    }());

Then you can start doing this

helloWorld.init();

and so on :)

It occured to me to do this after working on a javscript heavy project lately (and basically because I could never remember the syntax for a self executing function). As luck would have it others are blogging on the the topic of javascript patterns. I got our resident expert (the guy sitting next to me) to clean it up some and voila! Instant javascript object oriented cred!

Creating a VS template is easy - just hit "Export Template" under the file menu. You can crack that zip file open and tweak stuff up or make new templates as you see fit.

Ultimately I'd like to encapsulate a few templates like this - jQuery plugin, revealing prototype, and maybe JSON model.

Get it here