※この記事の書き方はこれまでのTypeScriptの書き方でした。ES6の書き方でTypeScriptの外部モジュールしたい以下元の記事===============こんにちは。TypeScriptには内部モジュールと外部モジュールとあって、自分では今まで内部モジュールで事足りていたのでした。整理の仕方を考えるでも最近仕様が確定されたES6だとreqire使うみたいなんで、そろそろ外部モジュール使う運用にした方がよいのかな?と思い調べてみたというのが今回の記事です。WikiBrowserifyブラウザだとrequire使ったコードがそのままだと動かなそうなので(最新のブラウザは動くかもしれないけど、、。調べてないです)、Browserifyを使って動かすようにします。Browserifyとはそれで、問題なのがTypeScriptをどうやってBrowserifyと関わらせるのか?なんですが、こちらに全て書かれていました。KuderatsifyというBrowserifyのプラグインがあるみたいでそれを使えば簡単にできました。npmそれで、タスクランナーにGulpを使うときはvinyl-source-streamっていうのも必要なようでそれも入れます。なんでvinyl-source-streamが必要なのかはこちらに書かれていました。はてなブログそれでできたのがこんな感じのgulpfile.jsです。'js-minify']);ts-debug(デバッグビルド)・ソースマップありts-release(リリースビルド)・ソースマップなしこれはそのままだと上のデバッグビルドと同じようになってしまうので、引数をつけます。IDEAだとこんな感じにArgumentsのところに書きますyargsっていうのを使えばこの引数を扱えるみたい。Overflowjs-releaseとするとJavaScriptをTypeScriptのリリースビルド(ts-release)のあとに最小化(minify)するようにしました。どこかにまとめて書いておけば全部うまくいきました。書き出すみたいな感じでした。classAfile.ClassA();ポイントとしては、requireした時点ではclassAfileはファイルの参照であって、その中のClassAまではまだリンクしていないということです。classAfile.ClassAと巡っていく必要があります。逆に言えば、ClassA.tsはClassAとして書き出されているわけではないので、他のClassなどを書いていくことができます。形式で書き出しています。これを使うときはこうなりました。書き出されているので、ファイルの中身を指定しなくても(ClassB.ClassBのようにしなくても)OKでした。毎回ファイルごとにimportとrequireを書くのが思ったよりも面倒です。内部モジュールなら1回どこかに書いておけばおkだったので。ECMAの流れとしては外部モジュール使っていくみたいなんで、慣れておいた方が良いという思いもありつつ、内部モジュールで足りてるならまだ内部モジュールでもいいんじゃないのかな?と思ったり。LINEスタンプ作りました!毎日使える。プログラミングこのブログについてこんにちは。フロントエンドエンジニアです。自作のiPhoneアプリを作っています。