

Angular2公式[チュートリアル３](https://angular.io/docs/ts/latest/tutorial/toh-
pt3.html)を見ると、下記の４つ .ts ファイルがありますが、

  * app.component.ts
  * boot.ts
  * hero.ts
  * hero-detail.component.ts

例えば `app.component.ts` を見ると、下記のように import しています。

[code]

    import {Hero} from './hero';
    import {HeroDetailComponent} from './hero-detail.component';
    
[/code]

gulp でコンパイルを *.ts として個別に行うのはもちろん問題はないのですが、ひとつの.jsファイルにまとめたい場合はどのようにすればよいでしょうか？  
はじめにまとめてロードすることで、HTTPリクエストを減らしたいと思っています。


CC BY-SA 3.0
2015-12-22T12:52:47.773
20298
2016-11-07T09:14:27.710
13768
question
angularjs gulp typescript
Angular2 で複数のTypeScriptファイルをひとつにまとめるには？


TypeScript
1.8でAMDやsystemモジュールを1ファイルに結合できるようになるそうですが、現状まだ無理なので、moduleをcommonjsでコンパイルしbrowserifyを使うとまとめられます。

[code]

    //tsconfig.json
    {
      "compilerOptions": {
      "target": "ES5",
      "module": "system",
    ...
    
    
    $ npm i browserify
    $ npm run tsc
    $ ./node_modules/.bin/browserify app/boot.js -o app/app.js
    
[/code]


CC BY-SA 3.0
2015-12-25T02:27:54.000
20350
2015-12-25T02:27:54.000
241
20298
answer


tsconfig.jsonで
`compilarOptions`の`out`プロパティに出力先ファイル名を指定すればimportやrequireが解決されて結合された状態でコンパイルされます。


CC BY-SA 3.0
2016-02-15T14:25:04.970
22118
2016-02-15T14:25:04.970
4635
20298
answer