Using Grunt-TSD w/ Node

If you are a fan of Typescript I assume you are well aware of the amazing type definition repository over at definitelytyped.org. This repository is great because it provides a definitive source for type definitions for pretty much every major JavaScript library.

If you are a fan of Node.js and JavaScript I have to assume that you are a fan of Grunt (or Gulp, your choice). You can use Grunt to automate pretty much every action needed when building HTML/JavaScript applications. Did you know you can also use Grunt to automate the retrieval of update type definitions from the DefinitelyTyped repository? Yup, you can. You simply need to use the Grunt-TSD plugin.

Here is how:

Reference the Grunt-TSD Plugin:
Simply NPM install the plugin using ‘npm install grunt-tsd –save-dev’

Add reference to the plugin inside your Grunt Script:
grunt.loadNpmTasks(‘grunt-tsd’);

Create a tsd.json file
In my opinion it is a bit cleaner to put your tsd configuration external to the grunt script, because of this I am following the path of creating a tds.json file. Make sure you create this file local to your gruntfile.js file. Below is my sample tsd.json file
tsdjson
Please note that the Path:typings entry in the tsd.json configuration is configurable. I wanted my d.ts files put into a ‘typings’ folder in my root. Of course you can change the name or location of this folder if you wish.

Download and install a Type Definition
In order to use a Type Definition you need to install it via TSD. To do this open your cmd prompt and CD into the directory which has your tsd.json file. Once there you can issue the following command ‘tsd query [package name] install -s -o’. This will install your package and update the tsd.json configuration files. For a full overview of the TSD syntax check out the TSD readme

Adding the TSD configuration to your Grunt file
After you have created your tsd.json file we need to create our configuration node inside of grunt. Below is my sample configuration.
tsd

Add the TSD task to a Registered Task
Once you have your TSD configuration node setup the last thing you will need to do is to call this from one of your Registered Tasks in your file.

Once you have all this setup you should be ready to roll. Simply issue a Grunt call to your configuration task (or use Grunt tsd) and watch the magic happen. To validate this worked as expected simply check you typings folder.

Till next time,

This entry was posted in Grunt, TypeScript. Bookmark the permalink. Follow any comments here with the RSS feed for this post.

Leave a Reply