Thursday, April 10, 2014

TypeScript in First-Class F# Web Projects

I was recently asked about how best to use TypeScript within a pure F# web project. Currently, there are two steps that are needed to make this happen. 

1. Add the TypeScript item template by downloading and installing the latest version of the F# Web Item Templates extension from http://visualstudiogallery.msdn.microsoft.com/f1dae7fe-1ecc-4f1b-86b5-32a2970d012a.


2. Modify your project file to allow the TypeScript files to compile to JavaScript when the project is compiled. To do this, you need to do the following:

- Edit your fsproj file. 

- Add the TypeScriptToolsVersion element and specify the appropriate TypeScript version that you have installed.


- Add 3 new commands to the BeforeBuild target.


- Save and re-open your project. You should now be good to go.



I plan to work on a solution to reduce the pain of step 2 in the near future, so stay tuned...


5 comments:

  1. I think that we can use more simplified version to run tsc.exe:





    How about this?

    ReplyDelete
  2. Unfortunately this doesn't seem to work, likely because the ts file is being added to the fsproj file as a standard Content rather than TypeScriptCompile. I haven't yet figured out how to add the ts files as TypeScriptCompile.

    ReplyDelete
  3. Oh, really?
    I've created my project as "MVC 5 and Web API" via online F# MVC 5 template, installed F# Web Item Templates 0.2.1, and added "TypeScript File" into my project.
    Then, TypeScriptCompile node were added in fsproj for this ts file.


    Or can we set ts files' build action as TypeScriptCompile manually?

    ReplyDelete
  4. Another suggestion:
    https://gist.github.com/yukitos/10523927#file-gistfile1-xml-L7-L10

    ReplyDelete
  5. Can't install F# Web Item Templates on Microsoft Visual Studio Express 2013.

    12-07-2014 20:00:18 - Searching for applicable products...
    12-07-2014 20:00:18 - Found installed product - Microsoft Visual Studio Express 2013 for Web
    12-07-2014 20:00:18 - Found installed product - Global Location
    12-07-2014 20:00:18 - VSIXInstaller.NoApplicableSKUsException: This extension is not installable on any currently installed products.
    em VSIXInstaller.App.InitializeInstall()
    em System.Threading.Tasks.Task.InnerInvoke()
    em System.Threading.Tasks.Task.Execute()

    ReplyDelete