3

Frame up

I have a MVC project that has C# classes in it that are ultimately serialized and consumed via ajax, etc. I use TypeLite to generate definitions of these C# classes (alternatives to TypeLite are discussed here), so I can get compile time checking against the code that consumes these json serialized C# classes. This way, if the C# definition changes and my TypeScript code doesn't, I will get a compile time error because it's tied directly to the C# definition

Initial Problem

Currently my TypeScript exists in the same project as my C# classes. So I have a very weird circular dependency issue. To resolve this, I have to follow a very particular pattern

  1. Update the C# class
  2. Compile the MVC project
  3. Run TypeLite, generating the definitions
  4. Update the TypeScript or encounter a compilation error at next build time.

I don't like this because I can't automatically run TypeLite as part of my build process. I can't do that since TypeLite needs the C# assembly from the MVC project to be built first in order to run and get access to the definitions. Also, I have to include the generated definitions in the code repository, which I don't like to do since its generated code and someone could forget to generate it and commit it / check it in.

Proposed Solution

I can easily break this circular dependency if I have a TypeScript project that depends on my MVC project. That way I can include TypeLite in the build, by removing it from the MVC project and placing it in the TypeScript project.

This approach feels very correct to me, since the TypeScript project is a separate, compiled project, that has a dependency on an assembly that is built before its own project.

Actual Problem / Question

Unfortunately I don't know how to have a TypeScript project outside of my MVC project that builds and then copies the generated JavaScript back into the MVC project (for deployments via web deploy and/or azure web role deployments). So, how would I have a TypeScript project that is separate from my MVC project that builds AFTER the MVC project and then copies the generated JavaScript back into the MVC project for deployment?

Community
  • 1
  • 1
Allen Rice
  • 19,068
  • 14
  • 83
  • 115

3 Answers3

3

So, how would I have a TypeScript project that is separate from my MVC project that builds AFTER the MVC project and then copies the generated JavaScript back into the MVC project for deployment?

You can include all your TS / JS files in a folder into your .csproj etc using the following statement:

<Content Include="src\**\*.*">
</Content>

And then manage compiling these externally using something like grunt-ts : https://github.com/grunt-ts/grunt-ts

Additionally advantage: your team mates can use any editor they like for TS and not be tied to VS. Helps your designers too.

basarat
  • 261,912
  • 58
  • 460
  • 511
  • Basarat, so nice to hear from you! I need to get caught up on your youtube videos. I completely forgot about using grunt! Since every developer here uses VS and we use TFS for builds, I'd want something that integrates into MSBuild. So, I'll be looking at integrating grunt-ts into msbuild builds. Is there any sort of *.*proj file that can work with grunt / grunt-ts? So far I've experimented with gutting a csproj and putting in the necessary targets to get it to build a .js file. So far, these are my favorite two leads. – Allen Rice Apr 10 '14 at 17:12
  • Found a good article about grunt-ts and visual studio! http://joeriks.com/2013/08/06/can-i-benefit-from-grunt-for-my-visual-studio-based-web-development/ With this, I can just include TypeScript in my MVC project, and build them via grunt w/ a post build task. That will solve the problem of copying files around. As long as I don't include the .targets file in the csproj, it wont try building the TypeScript (leaving it for grunt-ts) – Allen Rice Apr 10 '14 at 17:35
1

I used typelite for a short time and what I did was:

  1. Referenced the typelite dll to the place my entities are written(I assume you have a dll where all your entities are placed).

  2. Went to my WWW project(which has a reference to the entities dll in my case) and created a tt file which creates the ts files. The tt file imports the dll and does it's stuff.

When I compile my WWW web site, the entities project gets compiled and the .ts files are regenerated. The .ts files are place exactly where I wanted them to get placed and everything's ok.

Amir Popovich
  • 29,350
  • 9
  • 53
  • 99
1

We used a very simple approach back when the TypeScript compiler could not handle large numbers of source files: Create a typescript project off a subdirectory of your MVC project: So if your MVC structure looks like this:

\Content
\Controllers
\Scripts

Create a TypeScript project at

\Content\tscode\TypeScriptProject.sln.

Within your typescript project, you can then reference files that are below the root of the project:

/// <reference path="../../../Scripts/typings/jasmine/jasmine.d.ts"/>

You should then be able to setup your build definition to build MVC before TypeScript.
Hope this helps.

blorkfish
  • 21,800
  • 4
  • 33
  • 24