Web Essentials: compiling all TypeScript files during assembly does not work

Question

Just as the title says: I activated this option through the Tools > Options > Web Essentials window, but the files do not compile during assembly. There are no warnings or errors in the Output panel for Web Essentials that displays messages compiling something, but nothing has actually been done. None of the files that appear on the output is actually compiled.

Is there any way to find out what exactly he is doing? I made changes to the project file manually. I did not see anything related to Web Essentials in the project file.

Is there any other way to fix this problem?

Answer 1

Even if using WebEssentials for management, if all the files must be compiled during assembly, it can cause some problems:

• If you use a build machine, continuous integration with TFS, etc., your build process will not apply the same rules, since WebEssentials is an extension of Visual Studio and will not be available for the build process;

• You need to rebuild your project to check your changes if you also did not set the WebEsentials option “Compile TypeScript on Save” to true, which may be a bit redundant if you compile also during build;

Decision:

• Save WebEssentials "Compile TypeScript on Save" set to true;
• Add the TypeScript.targets file to your .csproj file. To do this, open YourProject.csproj file outside of Visual Studio using a text editor:
• Change your import section as follows:

 <Import Project="$(MSBuildBinPath)\Microsoft.CSharp.targets" /> . . . <Import Project="$(VSToolsPath)\TypeScript\Microsoft.TypeScript.targets" /> 

This will be enough to ensure that during compilation with a call to TypeScript, the compiler is called with the default settings for creating all .js files.

• If you want your files to be created with custom compiler options, set options for each build definition (e.g. Debug / Release):

 <PropertyGroup Condition=" '$(Configuration)|$(Platform)' == 'Debug|AnyCPU' "> <DebugSymbols>true</DebugSymbols> . . . <TypeScriptTarget>ES5</TypeScriptTarget> <TypeScriptIncludeComments>false</TypeScriptIncludeComments> <TypeScriptSourceMap>false</TypeScriptSourceMap> </PropertyGroup> 

This setting will also allow you to have different settings for each project, which is good for flexibility.

During the assembly process, the TypeScript compiler is called using the parameters defined in the definition of the current assembly. For example, as you install TypeScriptTarget on ES5 in the above settings, the executable command line will look like

 tsc.exe --target ES5 

Please note that only files marked with BuildAction = TypeScriptCompile will be processed. You can check / change the BuildAction for the file in the solution explorer, property bar: