10

Visual Studio 2012のTypeScriptへのJavaScriptライブラリの移植が完了しました。すべての約60のクラスで、各クラスは独自の.tsファイルで定義されています。

すべてのクラスは同じモジュールで定義されます。参照コメントを使用して、他のファイルで定義されているクラスを参照します。すべてのファイルのレイアウトは次のようになります。

///<reference path='./../myotherclass.ts' />

module MyModule {

    export class MyClass {
        ...
    }

}

これで、同じソリューションで2番目のプロジェクトを作成しました。これは、新しく移植したライブラリを使用して実際のアプリケーションになります。どういうわけかライブラリを含める必要があり、それがモジュールシステムの目的だと思います。ただし、MyModuleが数十のファイルに分散しているため、インポートするファイルがわかりません。これは、.d.tsファイルを使用できる目的ですか?

また、モジュールをインポートできるようにするには、「export」キーワードで宣言する必要がありますが、そうすると、参照コメントでモジュールが見つかりなくなります。

さらに、requireJSのようなモジュールローダーでコンパイラ出力を簡単に使用できるように、両方のプロジェクトをコンパイルする必要があります。

これをすべて達成するための最良のアプローチは何ですか?

ありがとうございました!

4

1 に答える 1

9

では、「モジュール」はさまざまな意味を持つ可能性があるということから始めましょう。たとえば、「MyModule」が作成する「モジュールパターン」があります。私が収集する限り、TypeScriptはこれらを言語仕様では「内部モジュール」と呼んでおり、RequireJSなどでロードする「外部モジュール」とは異なります。主な違いは、外部モジュールは、機能のエクスポートに使用できる事前定義された「エクスポート」オブジェクトを備えた独自の分離環境を想定していることです。

モジュールの出力を見てください。

var MyModule;
(function (MyModule) {
    var MyClass = (function () {
        function MyClass() { }
        return MyClass;
    })();
    MyModule.MyClass = MyClass;    
})(MyModule || (MyModule = {}));

「MyModule」にエクスポートしていることがわかります。これは、たとえばhtml「script」ブロックを使用してロードする他のスクリプトファイルでグローバルに使用できるようになります。これらが60個あるとおっしゃっていたので、各ファイルを1つずつロードする代わりに、マークアップに含めることができる単一のファイルを出力するようにコンパイラーを設定することもできます。

次に、モジュール宣言を「moduleMyModule{...}」から「exportmoduleMyModule{...}」に変更すると、出力がどうなるかを見てみましょう。

(function (MyModule) {
    var MyClass = (function () {
        function MyClass() { }
        return MyClass;
    })();
    MyModule.MyClass = MyClass;    
})(exports.MyModule || (exports.MyModule = {}));

ご覧のとおり、モジュールはまだ「モジュールパターン」を使用していますが、「エクスポート」のメンバーとして割り当てられています。これは、たとえば、ノードの「require」関数がロードされることを意味します。

この場合、実際に次のコードでモジュールを使用する必要があります。

import wrapper = module("./MyModule");
var instance = new wrapper.MyModule.MyClass();

「./MyModule」という名前は、実際にはモジュールが定義されているファイル名(.js拡張子を除く)を指していることに注意してくださいこれが、VSがそれらのモジュールを見つけることができなかったと言った理由です)。コードは次のようにコンパイルする必要があります。

var wrapper = require("./MyModule");
var instance = new wrapper.MyModule.MyClass();

これに追加するために、モジュールを持つために「module」キーワードで実際に何もする必要はもうありません。関数をエクスポートするだけです。

// foo.ts
export function foo() {
    ...
};

// some other file in the same dir
import wrapper = module("./foo");
var result = wrapper.foo();

これが機能するのは、関数'foo'が"exports"に直接割り当てられ、他のファイルでは"wrapper"にエイリアスされるためです。

モジュール関連のもののこの紛らわしい混乱にさらに追加するために、ノードの「require」とは異なり、AMDモジュールは非同期でロードされるため、まだ異なることにも言及する必要があります。TypeScriptにそれらを出力させるには、「-moduleAMD」パラメーターをコンパイラーに渡す必要があります。

とにかく、あなたが何を必要としているのか、何を望んでいるのかを正確に理解できるようになるまで、状況を十分に説明したことを願っています。最終的に使用するモジュールのタイプは、実際にはそれらをどのように使用するかによって異なります。つまり、ノード、Web、または両方の組み合わせです。

于 2012-10-07T19:22:22.860 に答える