11

I just upgraded to the latest version of WebEssentials v3 and the TS files in my ASP MVC 4 project aren't compiling to JS anymore. I verified that the Options --> Text Editor --> TypeScript --> Project --> Automatically compile TypeScript files which are part of a project option is checked, but nothing happens when I save or compile my project. I've tried deleting the existing .js and .min.js files that WE2 created, but that didn't help. I tried adding a new TS file to my project that and didn't generate a JS file. I reinstalled TS 0.9.1.1 and that didn't help.

Sooooo what to do? Am I missing something obvious? Is something not working or do I just have the wrong expectations?

Do I need to go back to WE2?

Update: I even created a brand new ASP MVC 4 C# project to verify it wasn't just my original project, but I got the same results.

Interestingly enough, I just created a new TypeScript project and my TS files compiled properly on save... So that's interesting..

Alex Dresko
  • 5,179
  • 3
  • 37
  • 57
  • It's all explained in the TypeScript Compile-On-Save Wiki page: https://typescript.codeplex.com/wikipage?title=Compile-on-Save – Jaben Aug 27 '13 at 12:29

4 Answers4

10

There are some links in the change log of WE3, here is the one describes how to enable the compile-on-save feature, see http://typescript.codeplex.com/wikipage?title=Compile-on-Save for details.

I've created a nuget package called Ltc.MSBuild.TS0911WE3.targets which will do the trick for you, just open Package Manager Console, type in Install-Package Ltc.MSBuild.TS0911WE3.targets!

Go to Ltc.MSBuild.TS0911WE3.targets on nuget.org.

bigsan
  • 756
  • 6
  • 12
  • Excellent. I created a test project to verify that this works. It's a more elegant solution than copy/pasting all the required code into the .xproj file as well. – Alex Dresko Aug 27 '13 at 16:07
  • Hm, doesn't work for me. It compiles on build, but not on save. :/ – Gleno Oct 07 '13 at 20:11
3

I'm not sure if this is the correct method of dealing with the problem, but here's what I did to get "compile on save" working on my project...

After noticing that Compile On Save worked when starting from a new HTML Application with TypeScript project, I did a comparison between that and my non-working ASP MVC project. Turns out, my ASP MVC project was missing this bit of code..

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

Copy/pasting that into my ASP MVC project gave me Compile On Save support again. Of course, it's still not exactly what I expected. The resultant JS files are not added to the project automatically, so that's something I had to do manually. I also had to manually group the JS file with the TS file to mimic the same experience I was getting with WE2.

Hope that helps someone. Would love to hear some feedback on the solution.

Alex Dresko
  • 5,179
  • 3
  • 37
  • 57
  • +1 thanks for sharing. The next release will allegedly have better support. Personally we've been using grunt https://github.com/basarat/grunt-ts – basarat Aug 26 '13 at 15:34
  • Thanks for sharing this - it works but frustratingly it also means you need to install TypeScript on your build server (if you have one). It's frustrating that the option marked "Compile On Save" is actually "Compile on Save or Build" in reality. For now I've decided to revert back to Web Essentials 2.9 so I get the ability to "Compile on Save" alone back. – John Reilly Oct 11 '13 at 13:36
2

Make sure your .proj file has a TypeScriptCompile XML section. You can copy from the typescript project if its not present.

Here is the specification : https://msbuildtypescript.codeplex.com/

basarat
  • 261,912
  • 58
  • 460
  • 511
  • HI @bassara. As I understand it, that recommendation adds a "Compile TS on project compilation" feature to the .xproj file. That's a sensible addition, but not exactly what I was asking in the OP. I apologize if the question was poorly worded. Also, after adding your recommendation to my project file, I get this error on compilation: Error 1 The "CompileTypeScriptFiles" task could not be loaded from the assembly c:\projects\Test\NewTsWeTest\NewTsWeTest\MSBuild.TypeScriptCompile.dll. Could not load file or assembly... – Alex Dresko Aug 26 '13 at 14:40
1

using the "web essentials" tool (free, recomended) enable the preview pane in the web essentials options

Tools --> Options --> Web essentials --> Typescript: Show Preview Pane[X]

Now every time you save an open TS file, web essentials makes sure the file compiles (so it can display it) and you can update your javascript code while the project is running.

user1852503
  • 4,747
  • 2
  • 20
  • 28