How to publish JavaScript files after upgrade to 0.9.1

Topics: General
Aug 16, 2013 at 4:01 PM
I upgraded from 0.9.0.1 to 0.9.1 and now if I add new .ts file, related .js file is not a part of the project (not included) and so it is not publishable in VS. Does it sound like a bug and I need to add .js files manually to the project for now? Any suggestions?
Coordinator
Aug 19, 2013 at 6:24 PM
A couple things here:

The .js files are no longer part of the project by default. Starting with 0.9.1, we don't nest them under the TypeScript files. This is more of a visual change, but it also lets us manage the .js files behind the scenes a bit cleaner.

Using the up-to-date targets file that comes with 0.9.1, you should be able to publish your .js files. Is this step not working? They should need to be part of the project to be published.
Aug 20, 2013 at 8:40 AM
@jonturner,

when you say that "Starting with 0.9.1, we don't nest them under the TypeScript files" do you mean that in a Visual Studio TypeScript project it should no longer be possible to see the generated .js files?

I'm using 0.9.1 and just added a new TypeScript file to a project but the .js file appears nested underneath.
Aug 22, 2013 at 5:09 PM
@jonturner

I have also noted that the .js files were not being included in my web deployment package when I publish a project (e.g. the example "HTML Application with TypeScript"). I assume in your reply on Monday you mean "They should NOT need to be part of the project to be published" in your last sentence.

So I looked a bit closer at the latest targets file to see how it adds the .js files to the published list, and it appears to set a PublishPipelineCollectFilesCore property group to include a new task TypeScriptCollectPublishFiles. It appears for this to work, that the TypeScript import target needs to be before the import of the web application target in the .csproj file. Or rather, for me, when I moved the line <Import Project="$(VSToolsPath)\TypeScript\Microsoft.TypeScript.targets" /> to be prior to the line <Import Project="$(VSToolsPath)\WebApplications\Microsoft.WebApplication.targets" Condition="'$(VSToolsPath)' != ''" />, then it started to include the .js files without having to have them appear in visual studio (including not nested either).
Coordinator
Aug 22, 2013 at 9:39 PM
@nabog - that may be the case for projects made with previous versions of the plugin, as the nesting is described in the project itself. You can still see the generated .js if you select "Show All Files" in the Solution Explorer.

@pgbross - Good catch, I mistyped. You should not need to pull in the .js files into your project. When you publish now, they should be part of what is published. I know there was a fix to this right after 0.9.1.1 shipped, so this may be fixed for the next version, but I'm going to file a bug just in case.
Aug 22, 2013 at 9:45 PM
@jonturner, thank you for the explanation. Looking forward to see the next version :)
Aug 28, 2013 at 8:14 AM
By using pgbross's method, it starts publish js. But it won't publish ts and map, that makes debugging online web server hard. I have tried to set ts file CopyToOutputDirectory PreserveNewest, but with no luck.
Aug 28, 2013 at 7:28 PM
jonturner wrote:
A couple things here:

The .js files are no longer part of the project by default. Starting with 0.9.1, we don't nest them under the TypeScript files. This is more of a visual change, but it also lets us manage the .js files behind the scenes a bit cleaner.

Using the up-to-date targets file that comes with 0.9.1, you should be able to publish your .js files. Is this step not working? They should need to be part of the project to be published.
Just an update to this. The above is true (only) for the "demo file"/scaffolding for new TS project (greeter). If I add a new TypeScript file (which also creates a "demo"):
  • the .js file is generated as well (nested under ts)
  • it is however, part of the solution (nested under ts file)
  • publishing the project publishes this .js (aka "compiled" file).
Coordinator
Sep 6, 2013 at 3:24 PM
@EdSF

When you say "if I add a new TypeScript file", are you saying adding it to a project made before 0.9.1? If so, then yes, you'll get the old behavior.

I think the new behavior is on projects started in 0.9.1 (or those converted by hand over to use the slightly new project style).

If you're creating a new project in 0.9.1 (or 0.9.1.1) and seeing this nesting behavior, that's probably an issue we need to iron out.
Sep 6, 2013 at 8:30 PM
Also, having NuGet package restore enabled for whatever reason prevents the compiled JS files from being published. If you edit the project file and change <RestorePackages>true</RestorePackages> to <RestorePackages>false</RestorePackages> it then publishes the compiled JS files. I've tried moving the nuget targets import around as suggested for the TS targets (by @pgbross) file by putting before/after TS targets import, but that didn't make any difference. So, it seems that the other targets files conflict with the TS targets file for publishes.
Coordinator
Sep 9, 2013 at 3:25 PM
This discussion has been copied to a work item. Click here to go to the work item and continue the discussion.
Sep 13, 2013 at 5:41 PM
@pgbross Changing the order of the <Import> statements solved the problem for me too. Thanks!
Sep 24, 2013 at 1:25 PM
Moving the Import statement before WebApplication.targets solves the problem of publishing, but it won't use any typescript settings anymore.

Moving the typescript settings to before the import works, but then variables like $(WebProjectOutputDir) are not available, which is needed for single file output.
Nov 18, 2013 at 9:58 AM
I believe you can also edit the Microsoft.TypeScript.targets.

From the MSBuild logs I see that the target TypeScriptCollectPublishFiles only collates a list of files to publish and if I am correct, this can be run at any time after the CompileTypeScript target.
I changed the compileDependsOn target to the following :-

<PropertyGroup>
<CompileDependsOn>
  CompileTypeScript;
  TypeScriptCollectPublishFiles; <!-- Newly added -->
  $(CompileDependsOn);
</CompileDependsOn>
</PropertyGroup>

This will work for all projects being built and should negate the need to change each visual studio *.proj file to compensate for the default behaviour.

I haven't investigated if this impact anything greater than publishing the files, but it's something that works for me at the moment.
Nov 21, 2013 at 3:06 PM
I'm trying to get js files to be generated in Team Build and copied to _PublishedWebsites folder. I modified Microsoft.TypeScript.targets file and added TypeScriptCollectPublishFiles; under CompileDemendsOn node, however, I'm still not getting the .js files to copy. On my machine they build and copy to the publish folder correctly.

Any ideas on what I can try on the build folder?
Nov 21, 2013 at 3:18 PM
Edited Nov 21, 2013 at 3:21 PM
Hi,

In visual studio , select a typescript file, look at the properties, can you confirm that the 'Build Action' property is set to 'TypeScriptCompile'?

If this is set correctly, then ensure typescript 0.9.1.1 is installed on the build server.

If the two statements above are true, then you will need to look at the msbuild log to see if the typescript files are seen by the typescript compiler.
You can do this by searching for the name of any typescript file, and then it's corresponding *.js file.

Let me know how you get on.

Vijay
Nov 21, 2013 at 3:38 PM
In visual studio , select a typescript file, look at the properties, can you confirm that the 'Build Action' property is set to 'TypeScriptCompile'?
Yes. All .ts files are set to 'TypeScriptCompile' and compile correctly on developer workstation.
If this is set correctly, then ensure typescript 0.9.1.1 is installed on the build server.
I ran the installer several times to make sure. What I'm about to try is install VS2013 on the build server and see how the solution will compile on there using Visual Studio vs Team Build.
If the two statements above are true, then you will need to look at the log to see if the typescript files are seen by the typescript compiler.
You can do this by searching for the name of any typescript file, and then it's corresponding *.js file.
As far as logs. I turned on Diagnostic logging mode on the Build Definition and it shows that the files were downloaded from course control however, the logs do not show that specific source files were built. I did not see .ts files listed, however, I did not see any of my .cs files listed either. Maybe I'm looking at the wrong log?

Ilya
Nov 21, 2013 at 3:44 PM
Edited Nov 21, 2013 at 3:44 PM
Hi,

Seems the log you're looking at is not quite right. In the Build report of your build, you'll see 'View Log File' for the solution you're building.

In the log you'll find something like this.

CompileTypeScript:
C:\Program Files (x86)\Microsoft SDKs\TypeScript\tsc.exe --target ES5 "<PATH>\FirstFile.ts"
TypeScriptCollectPublishFiles:
Adding to FilesForPackagingFromProject: <PATH>\FirstFile.js;
Nov 21, 2013 at 5:02 PM
Okay, it appears the log was not available because I did not specify the drop folder.

I have the following lines in the log for the default Html Website with TypeScript project that I added to the solution:
       Using "VsTsc" task from assembly "C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v11.0\TypeScript\TypeScript.tasks.dll".
       Task "VsTsc"
       C:\Program Files (x86)\Microsoft SDKs\TypeScript\tsc.exe  --module amd --sourcemap --target ES5 "app.ts"
later in the log I have:
      Task "Message"
       Adding to FilesForPackagingFromProject: app.js
       Done executing task "Message".
However, still not files in the _publishedwebsites.

Here's a link to the log file.
Nov 21, 2013 at 7:27 PM
I installed VS2013 on the build machine, opened the solution and was able to generate .js files by doing a regular build within Visual Studio as well as publish to a folder and have the .js files copied over. I'm still not sure what's going on with the Team Build then...
Nov 22, 2013 at 11:28 AM
Have you tried moving the targets around, as stated in this thread?
Nov 22, 2013 at 12:03 PM
VijayKotecha wrote:
Have you tried moving the targets around, as stated in this thread?
I have. That's how I got .js files to be copied when doing the manual publish from VS. Still no luck on Team Build though.
Nov 22, 2013 at 2:39 PM
Edited Nov 22, 2013 at 2:52 PM
Hi,

TFS Build: You're right in that the _PublishedWebsites folder won't have the js files. I have verified this.
However, my build process is tweaked such that I don't create a _PublishedWebsites folder and my build is building as if a developer is building on his own desktop.
See my blog article - http://vijayskotecha.blogspot.se/2012/08/tfs-2010-custom-build-output-directory.html

I was under the impression you had an extra step to actually publish the files for a given web project, whereas you are just building the code and expecting the _PublishedWebsites folder to include everything you want.

In my TFS build process, I pass in the following as MSBuild arguments:- /p:DeployOnBuild=true /p:PublishProfile=build /p:VisualStudioVersion=11.0.
In each of my web projects I have defined a publish profile as "build" - it is publishing to a file system.
This web deploy publish actually contains the *.js files as required.
http://msdn.microsoft.com/en-us/library/dd465337(v=vs.110).aspx

So just to summarise, the default TFS build process does not include the *.js files for some reason - but if you use the publish mechanism , web deploy, you get the files. (The web deploy is what you've been using on your desktop, when you say it works, I think).

Vijay.
Nov 26, 2013 at 2:43 AM
Thanks for the helpful tips Vijay.

Your solution mostly works for me, however I am having a problem where it seems that the publish process takes place before the post-build events.

This only seems to be the case when done on the build server and works fine on local machine. Any ideas on how I can troubleshoot?

Thanks,
Shaun
Nov 26, 2013 at 8:09 AM
Hi,

If you're using TFS 2012 then ensure the MSBuild Multi Proc Arg is set to false.
If you're using TFS 2010 then ensure you're not using the /m flag.

The scenario you mentioned could be caused by multiple threads per build.

If this isn't the cause then it's best to run through the MSBuild (build) log to see what the ordering is.

Vijay
Nov 26, 2013 at 1:58 PM
Hi Vijay,

I verified parallel building is not enabled.

Is there a better build log I can find other than the report displayed within visual studio? (in other words, the one visible when navigating to the build status from team explorer).

Even in diagnostic mode, I don't get nearly the level of information as I do in the 'output' tab when building from within visual studio, particular with regard to publishing and post-build command output.
Nov 26, 2013 at 2:43 PM
Hi,

As mentioned previously, there should be a build log produced within the build output.
Ensure your build is outputting some artifacts.
You should also see the link to the log as 'view log file' in the 'view summary' report.

Vijay.
Nov 27, 2013 at 12:18 PM
Even in 0.9.5 beta the JS files still do not publish using VS2013. I've tried @pgbross and @VijayKotecha suggestions to no such luck.

Does anyone else have problems publishing the JS files w/ 0.9.5 beta in VS2012/2013?
Nov 27, 2013 at 1:19 PM
In my build summary after publishing the entry is added before the publish...

2>C:\Program Files (x86)\Microsoft SDKs\TypeScript\0.9\tsc.exe --removeComments --module amd --target ES5 --locale en-US

Not sure if this info helps.

Also, what is the "locale" switch?
Nov 28, 2013 at 7:54 AM
Edited Nov 28, 2013 at 7:55 AM
Not sure how relevant it is to you but we had a similar issue recently where our javascript files weren't getting added to the msdeploy packages in our CI pipeline.

I modified the csproj file with the following (could probably add it to the targets file instead but wasn't willing to mess around with it):
 <Target Name="TypeScriptJsCollectFiles">
    <ItemGroup>
      <_CustomFiles Include=".\**\*.js" />
      <FilesForPackagingFromProject Include="%(_CustomFiles.Identity)">
        <DestinationRelativePath>%(RecursiveDir)%(Filename)%(Extension)</DestinationRelativePath>
      </FilesForPackagingFromProject>
    </ItemGroup>
  </Target>
  <PropertyGroup>
    <CopyAllFilesToSingleFolderForPackageDependsOn>
      TypeScriptJsCollectFiles;
      $(CopyAllFilesToSingleFolderForPackageDependsOn);
    </CopyAllFilesToSingleFolderForPackageDependsOn>

    <CopyAllFilesToSingleFolderForMsdeployDependsOn>
      TypeScriptJsCollectFiles;
      $(CopyAllFilesToSingleFolderForPackageDependsOn);
    </CopyAllFilesToSingleFolderForMsdeployDependsOn>
  </PropertyGroup>
Hope this helps :)