Verify JavaScript with JSLint during build using Nant

image Project I’m working on has a lot of JavaScript. We are minimizing JavaScript files during the build and combining them into one file. Problem is when someone checks in some invalid JavaScript into repository that doesn’t minify properly. As a result you can end up with not working JavaScript at all. There is a tool called JSLint. It is created by Douglas Crockford who is also the author of a very good book about JavaScript: “JavaScript: The Good Pars”.

JSLint is a very strict JavaScript verifier. JS files corrected to a JSLint specification could be minified with confidence.

We made the decision that build should brake when JSLint detects invalid JavaScript file, so developer will need to fix it before the code checkin.

Prepare the tool base

As a first step we need to get all the tools that will execute JSLint validation against our codebase. You can grab fulljslint.js from the JSLint home page. There is no executable binary for JSLint, it is just a JavaScript file with set of rules and function to execute verification. Our working environment is Windows we can execute validation using cscript.exe command line tool that Windows has. There is a very useful script created by Jason Diamond that helps to execute JSLint validation. You can get it from from here: jslint.wsf. One last thing is a command line batch file that helps execute this tool. You can name it whatever you would like to. I named it jslint.bat. The content of it looks like this:

@cscript //nologo %~dp0\jslint.wsf %*

I put all those three files into build tree, in tools folder. You can check if all the files are valid and working properly by running this command from command line:

jslint.bat c:\path\to\your\js\file.js

Create a build target

Now that we have all the tools we can create a build target. We are using Nant as a build tool. I created Nant target and called it jslint. It looks like this.

<target name="jslint" description="validates JS files">

    <foreach item="File" property="jsfile">

        <in>

            <items>

                <include name="path\to\scripts\folder\**\*.js" />

            </items>

        </in>

        <do>

            <exec program="jslint.bat" commandline="${jsfile}" />

        </do>

    </foreach>

</target>

There is a lot of stuff that could be turned on/off during validation. If you type jslint.bat without any parameters it will give you a list of possible options. Those could as well be tweaked in the jslint.wsf file.

Hope this helps you as it did for us.

Some says that JSLint might hurt your feelings. I say, bring it on 🙂

Gregster

Custom JavaScript KungFu and management for Microsoft MVC.NET

Rails community got a lot things right for web application. One of them is the way they manage JavaScript files. I’m working on a web project where I use a lot of JavaScript and MVC.NET as Web Framework. Team is quite big and JavaScript is getting out of control. Files are everywhere with a lot of code. And then when it goes into production it is the best to have it as one compressed and minified file. So, here what we did.

Where am I, ups, production, I better behave

The easiest possible way of telling the app where it is running will be in Web.config. There is already a bunch of custom setting in there, so why not just have one more. When the time comes based on the Environment information we can decide if we will still spit out single un-minified files for a development environment or serve one minified file for lightning fast production performance.

Continue reading