Compile-on-Save

With TypeScript 0.8.2, we've enabled the ability to compile a project when source files in the project are saved, circumventing the usual manual compile step.

For this to work, you need to enable the global setting in Tools->Options->Text Editor->TypeScript->Project. Specifically, enable "Automatically compile TypeScript files which are part of a project".

Next, you need to make sure your Visual Studio project uses the new TypeScript targets file. You can do this in one of two ways. New projects created with the TypeScript 0.8.2 release will automatically include a link to this targets file (as will the new version of the Windows 8 sample in the samples directory). For projects made with previous versions, you will need to edit the project file by right-clicking the project, selecting "Unload Project", right-clicking the project, selecting "Edit", and updating the project XML with the following:

For each TypeScript file in your project, change the build action to 'TypeScriptCompile':
<TypeScriptCompile Include="app.ts" />

Then additionally add (or replace if you had an older PreBuild action for TypeScript) the following at the end of your project file to include TypeScript compilation in your project.

For JavaScript projects (.jsproj):
<Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.VisualStudio.$(WMSJSProject).targets" />
  <PropertyGroup Condition="'$(Configuration)' == 'Debug'">
    <TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptIncludeComments>true</TypeScriptIncludeComments>
    <TypeScriptSourceMap>true</TypeScriptSourceMap>
  </PropertyGroup>
  <PropertyGroup Condition="'$(Configuration)' == 'Release'">
    <TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptIncludeComments>false</TypeScriptIncludeComments>
    <TypeScriptSourceMap>false</TypeScriptSourceMap>
  </PropertyGroup>
  <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets" />

For C#-style projects (.csproj):
  <PropertyGroup Condition="'$(Configuration)' == 'Debug'">
    <TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptIncludeComments>true</TypeScriptIncludeComments>
    <TypeScriptSourceMap>true</TypeScriptSourceMap>
  </PropertyGroup>
  <PropertyGroup Condition="'$(Configuration)' == 'Release'">
    <TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptIncludeComments>false</TypeScriptIncludeComments>
    <TypeScriptSourceMap>false</TypeScriptSourceMap>
  </PropertyGroup>
  <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets" />

Last edited Jan 23 at 4:34 PM by LukeH, version 7

Comments

middlewest Apr 24 at 8:14 PM 
this feature doesn't work in 0.9 anymore

coolmuse Feb 7 at 9:05 PM 
I found that my project has too many .ts files to be properly processed on the tsc command line. I replaced the <Target Name="CompileTypeScript"> in Microsoft.TypeScript.targets to use a response file:

<Target Name="CompileTypeScript">
<Message Text="Compiling TypeScript files" />
<Message Text="Creating response file tscompile.rsp" />
<WriteLinesToFile File="tscompile.rsp" Lines="@(TypeScriptCompile)" Overwrite="true" />
<Message Text="Executing tsc $(TypeScriptBuildConfigurations) @tscompile.rsp" />
<Exec Command="tsc $(TypeScriptBuildConfigurations) @tscompile.rsp" />
<Delete Files="tscompile.rsp" />
</Target>

xmehaut Jan 31 at 1:39 PM 
hello,
which directive to compile everything into a single file (--out)?
best regards
Xavier

muzza Jan 22 at 9:41 PM 
typo "Automatically compile TypeScript files which care part of a project"