Simple module dependencies in Typescript

I’m not that convinced about the AMD module model. I rather use a simpler model which is also easily possible to achieve with typescript: use <reference path…> and compile to one file using the –out parameter.

This is my application structure:

  • main.ts (contains bootstrap startup code, reference to refs.ts)
  • refs.ts (contains all references)
  • modules… (contains only a single ref, to refs.ts)

With this structure I run the instruction

TSC refs.ts --out refs.js

To get refs.js with all code from all referenced files. The refs.ts has all references in order (where necessary).

On deploy to the live site I simply minify the refs.js.

With this I only need to include <script src=”refs.js”> in my html.

I have the command to compile with –out as an external tool in Visual Studio. It would be nice to have it included in Web Essentials. I have disabled “create typescript on save” in my web essentials.

When I add a new module I need to remember to include it in refs.ts. After that it’s available globally in my application, and it will be included in main.js.

I also need to remember to re-build the solution (or run my custom tool) before I test run (parts of) the application after editing a file.

Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s