Adding TypeScript To An Existing Visual Studio Project

Feeds

Thursday, 4th October 2012

The chances are that if you are going to use TypeScript, you'll want to add it to an existing project. The great news is that it is really simple to do.

There are two simple steps. You have probably already performed the first step and downloaded the TypeScript for Visual Studio extension - so let's skip on to the second step - adding the build event to your project.

The second step (and this is my second solution to this problem as the pre-build event could sometimes be troublesome) is to add the following sections to your project file. You will need to select "Unload project file" from the project context menu to edit the project within Visual Studio - or you can just hack it in Notepad!


  <ItemGroup>
    <AvailableItemName Include="TypeScriptCompile" />
  </ItemGroup>
  <ItemGroup>
    <TypeScriptCompile Include="$(ProjectDir)\**\*.ts" />
  </ItemGroup>
  <Target Name="BeforeBuild">
    <Exec Command="&quot;$(PROGRAMFILES)\Microsoft SDKs\TypeScript\0.8.0.0\tsc&quot; @(TypeScriptCompile ->'&quot;%(fullpath)&quot;', ' ')" />
  </Target>

This will compile all your .ts TypeScript files into .js JavaScript files.

Want more information on TypeScript? Get TypeScript For JavaScript Programmers from Amazon.