ファイルモジュール

グローバル名前空間
デフォルトでは、新しいTypeScriptファイルにコードを入力すると、コードは_グローバルの_名前空間に追加されます。デモとして、foo.tsファイルを考えてみましょう：
var foo = 123;
同じプロジェクトで新しいファイルbar.tsを作成したとします。TypeScriptの型システムは、この新しいファイルの中で、変数fooをグローバルに利用することを許可します：
var bar = foo; // 許可されます
言うまでもありませんが、グローバル名前空間を使うと、名前が競合する危険があります。次に説明するファイルモジュールを使用することをお勧めします。
ファイルモジュール
外部モジュールとも呼ばれます。TypeScriptファイルにimportまたはexportが存在する場合、そのファイル内に閉じたローカルスコープが作成されます。上で説明したfoo.tsを次のように変更してみます(exportに注目してください)：
export var foo = 123;
私達はもはや、グローバルのfooを持っていません。これは、次のように新しいファイル bar.tsを作成することで実際に確認できます：
var bar = foo; // ERROR: "'foo'が見つかりません"
bar.tsでfoo.tsのものを使いたい場合_明示的にインポートする必要があります_。これを以下の更新版のbar.tsに示します：
import { foo } from "./foo";
var bar = foo; // 許可されます
bar.tsでimportを使うと、他のファイルから取り込むことができるだけでなく、ファイルbar.tsをモジュールとして認識するので、bar.tsでの宣言はグローバル名前空間を汚染しません。
外部モジュールを使用するTypeScriptファイルをJavaScriptにコンパイルできるようにするには、moduleオプションをtsconfig.jsonで設定する必要があります。
最終更新 6mo ago