Have TypeScript working with VS.NET 2013/2015 SharePoint Project Template

Assuming that…

1) You have latest TypeScript for Visual Studio installed

2) You have a SharePoint project and you add TypeScript file to it. Everything appears fine but you can’t generate .js file when you save it.

 

Following steps should solve the problem:

Step 1

Go to

C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v14.0\SharePointTools (For Visual Studio 2013, that is: C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v12.0\SharePointTools) and open Microsoft.VisualStudio.SharePoint.target file in notepad

Step 2

Add following just before the <Import Project="$(CustomBeforeSharePointTargets)" …… line in the targets file

<Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets" Condition="Exists('$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets')" />

Step 3

Save the file and re-open VS.NET with SharePoint project. Try saving the .ts files and now you should have corresponding .js files generated.

Basically, the above target calls the Microsoft.TypeScript.targets which eventually will run the TypeScript compiler when .ts files are saved.

Step 4 (Optional)

Although the targets calls the right version of compiler, you might following problem:

After installing TypeScript 1.6 for VS.NET, typing “tsc –v” in package manager should result in 1.6.x. If not, it’s very likely that you had older version of VS.NET which created a PATH variable with old TypeScript location.

To fix it:

Open PATH variable value of the computer, remove old value of TypeScript location and replace with following:

C:\Program Files (x86)\Microsoft SDKs\TypeScript\1.6

Reopen VS.NET and you should be good!