Cannot compile TypeScript files in Visual Studio 2

Question

I downloaded and installed TypeScript extension for VS 2012, I got my first sample compiles by manually dragging the ts file onto the tsc.exe file! because no other way to compile the file will work.

I don't want to manually do this everytime I want to debug a page! I have read about 5 articles on the web and none of the solutions work. I've tried adding TypeScript compiler to PATH in Windows, I've tried downloading and installing via Nuget Package Manager the Sholo thing, I've tried these pages:

1. Using TypeScript in cshtml files
2. Visual Studio TypeScript Options
3. Debugging TypeScript code with Visual Studio
4. Cannot compile typescript using tsc node module
5. TypeScript - Visual Studio - d3
6. Visual Studio 2012 TypeScript project ignoring two files during compile
7. TypeScript / Visual Studio 2012 / Compilation parameters
8. Using TypeScript in an existing Visual Studio Web Site project
9. Visual Studio TypeScript Options
10. Compile generated files in Visual Studio

And not a single solution has worked.

I have even downloaded and installed the Web Essentials plugin for Visual Studio and gone to Options menu, then selected "Compile all TypeScript files on Build = True" and "Compile TypeScript on Save = True" - but nothing works.

I've read the entire TypeScript website, the specification, and even their discussion tab on the codeplex site.

How can I get TypeScript to compile when I save changes to the .ts file or when I press F5/Debug/Build?

*I don't really want any third-party scripts/plugins, etc unless it's absolutely necessary. I've seen a couple of them and it's just ... there's no point. I might as well just write pure JavaScript.

Answer 1

I had a similar problem when I renamed my .js files to .ts. You have to right click and add a new TypeScript File to your project in order for your .csproj to recognize that the TypeScript compiler should be used on this .ts file.

You will know it is correct when you see the arrow to expand the .ts file.

Answer 2

You have to ensure that the BuildAction must be TypeScriptCompile for your .ts files. I've added these lines to end of the (.csproj) project file. (Before closing Project tag) And It seems working.

 <PropertyGroup Condition="'$(Configuration)' == 'Debug'">
<TypeScriptTarget>ES3</TypeScriptTarget>
<TypeScriptIncludeComments>true</TypeScriptIncludeComments>
<TypeScriptSourceMap>true</TypeScriptSourceMap>
<TypeScriptModuleKind>AMD</TypeScriptModuleKind>
 </PropertyGroup>
<PropertyGroup Condition="'$(Configuration)' == 'Release'">
<TypeScriptTarget>ES3</TypeScriptTarget>
<TypeScriptIncludeComments>false</TypeScriptIncludeComments>
<TypeScriptSourceMap>false</TypeScriptSourceMap>
<TypeScriptModuleKind>AMD</TypeScriptModuleKind>
</PropertyGroup>
 <Import Project="$(VSToolsPath)\TypeScript\Microsoft.TypeScript.targets" />

Answer 3

I had the same problem. I updated web essentials extention and problem is solved. If you have web essentials extention, you can try that.

Answer 4

If you change a .js file into a .ts file, you can go to the properties panel in Visual Studio and change the Build Action to TypeScriptCompile. This is what is missing when you change a file. This can save you from deleting and re-adding files.

Answer 5

I had the same problem. I couldn't add new .ts file to the project. After renaming from .js to .ts file was not compiled. It even was not compiled using tsc in command line.

BUT! After recreating the file in windows explorer it was compiled successfully. And after manually creating file in windows explorer (not Visual Studio) in Scripts folder and including it to the project - all WORKS. I couldn't detect changes between these two files. But if you create text file in explorer, rename it to .ts and after that include in project and set file's Build Action to TypeScriptCompile - it works.

Answer 6

plug

I create a NuGet package that adds a afterbuild target to your project so all the included ts files are compiled to js.

Install-Package TypeScript.Compile