TypeScriptでRequire.jsのdefine()が使えなかった件

TypeScriptもバージョン1.0が出たし使ってみるかーと思い作成しているものにRequire.jsでAMDに対応させようと思ったら詰まったときの備忘録です。

環境

• TypeScript 1.0.1
• Require.js 2.1.14
• durandal 2.1.0

define()が使えない？

以下のjsのコードをTypeScriptに置き換えるときにこのまま突っ込んだらコンパイル時に「defineの引数がおかしいけど？」ってニュアンスのコンパイルエラーが発生。

define(['plugins/router', "durandal/app"], function (router, app) {
    return {
        router: router,

        search: function() {
            app.showMessage("Not Implemented", "Error");
        },

        activate: function () {
            router.map([
                { route: '', moduleId: 'hoge/huga', title: "hoge", nav: true }
            ]).buildNavigationModel();

            return router.activate();
        }
    };
});

import文を使えばいいらしい

調べたり、友人に訪ねて見ると
「require.jsを使うときは基本的にimport文を使え」とのこと

早速適応してみる。

/// <reference path="durandal.d.ts" />

import _router = require('plugins/router');
import _app = require('durandal/app');

class hoge {

    app = _app;
    router = _router;

    search() {
        this.app.showMessage("Not Implemented", "Error")
    }

    activate() {
        this.router.map([
            { route: '', moduleId: 'hoge/huga', title: "hoge", nav: true }
        ]).buildNavigationModel();
        return this.router.activate();
    }
}

export = hoge;

上記のソースにコンパイルオブション"-m amd"を追加するとコンパイルが通るらしい。
僕の環境ではGruntを使用しているので、grunt-typescriptのmoduleオブションに'amd'と付ける。

コンパイルしてみるとコンパイルは通りjsファイルは生成されたが、中身にはdefineが使われていなかった…
何か不足していることがあるのか調査が必要なようだ。

追記

解決したので追記します。

どうやらexportしてあげなきゃいけないらしい。
というわけで、正しく動作するように上記のソースを修正した。

ちなみにexport class hogeとやると、コンパイル後に別の動作になる。