This project has moved and is read-only. For the latest updates, please go here.

Bundle Transformer: TypeScript

BundleTransformer.TypeScript contains translator-adapter TypeScriptTranslator (supports TypeScript version 2.3 RTM). This adapter makes translation of TypeScript-code to JS-code. Also contains HTTP-handler TypeScriptAssetHandler, which is responsible for text output of translated TypeScript-asset.

BundleTransformer.TypeScript does not support external modules (CommonJS, AMD, SystemJS, UMD and ES6 modules).

As a JS-engine is used the JavaScript Engine Switcher library. For correct working of this module is recommended to install one of the following NuGet packages: JavaScriptEngineSwitcher.Msie, JavaScriptEngineSwitcher.V8 or JavaScriptEngineSwitcher.ChakraCore. After package is installed and JS-engine is registered, need set a name of JavaScript engine (for example, MsieJsEngine) to the name attribute of /configuration/bundleTransformer/typeScript/jsEngine configuration element.

To use a debugging HTTP-handler in the IIS Classic mode, you need add to the /configuration/system.web/httpHandlers element of the Web.config file a following code:

<add path="*.ts" verb="GET"
  type="BundleTransformer.TypeScript.HttpHandlers.TypeScriptAssetHandler, BundleTransformer.TypeScript" />

When using the types declared in other files, you need add to code the references to these files by using the "reference" comments, as shown in the following example:

/// <reference path="./jquery.d.ts" />
/// <reference path="./ITranslatorBadge.d.ts" />

module TranslatorBadges {
   export class TranslatorBadge implements ITranslatorBadge {
      …
   }
}

If you are add TypeScript-files to the bundle by using the IncludeDirectory method, then I recommend you to use instance of the ScriptDependencyOrderer class from the Arraybracket.Bundling project as a bundle orderer:

namespace BundleTransformer.Example.Mvc
{
   …
   using Arraybracket.Bundling;public class BundleConfig
   {
      public static void RegisterBundles(BundleCollection bundles)
      {
         …
         var tsBundle = new Bundle("~/Bundles/TypeScripts");
         tsBundle.IncludeDirectory("~/Scripts/ts/", "*.ts", true);
         tsBundle.Builder = nullBuilder;
         tsBundle.Transforms.Add(new ScriptTransformer(new []{ "*.d.ts" }));
         tsBundle.Orderer = new ScriptDependencyOrderer();
         bundles.Add(tsBundle);
         …
      }
   }
}

This will allow to properly sort TypeScript-files in the bundle (on the basis of information, that obtained from the "reference" comments).

Last edited Apr 28 at 5:56 PM by Taritsyn, version 21