TypeScript

BundleTransformer.TypeScript contains one translator-adapter - TypeScriptTranslator (supports the TypeScript version 5.7 RTM). This adapter makes translation of TypeScript code to JS code. Also contains the TypeScriptAssetHandler debugging HTTP handler, 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, you need to install one of the following NuGet packages:

• JavaScriptEngineSwitcher.ChakraCore
• JavaScriptEngineSwitcher.Jint
• JavaScriptEngineSwitcher.Msie (only in the Chakra modes)
• JavaScriptEngineSwitcher.V8

After package is installed and JS engine is registered, need set a name of JS engine (for example, MsieJsEngine) to the name attribute of /configuration/bundleTransformer/typeScript/jsEngine configuration element in the Web.config file.

To use a debugging HTTP handler in the IIS Classic mode (this also applies to the XSP web server for Mono), 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).