[追記]
Gulpプラグインで受け取れるファイルストリームが順不同で、実行するたびにfilesの順序が変わる可能性がある。
ので、atom-typescriptと同じようにfilesGlobを展開するだけのCLIを作ったのでこっちを使って欲しい。
laco0416/tsconfig-cli
Globの展開に使ってるのはatom-typescriptの内部でも使われてるTypeStrong/tsconfigなので、割と信用していいはず。少なくともnpmにある他のtsconfig展開系CLIはどれも独自にglob展開しているので使いたくなかった。
tsconfigに設定を集める、タスクランナーに設定を持たないべきという思想のメモという意味でこの記事は残す
@laco0416です。gulp.srcのglobパターンからtsconfig.jsonのfilesを更新するプラグインを作りました。
gulp-tsconfig-update
https://www.npmjs.com/package/gulp-tsconfig-update
TypeScript1.6で不要になりました！→やっぱり必要でした
TypeScript 1.6からtsconfig.jsonにexcludeプロパティが生えますのでnode_modulesあたりをぶち込んでおけば幸せっぽい！
詳しいTypeScript 1.6の変更点はこちら
1.6来るのはわかってたけどまさか5日で要らない子になるとは思ってなかった
excludeだけだとコンパイルの順序を指定できないのでよくない。やっぱりglob必要だった。
やりたかったこと
昨日@vvakameさんとご飯を食べながら話していたら
laco「gulp-typescriptにオプション渡すのおかしい気がしてきた」
vv「tsconfig.json使おう？」
laco「filesにファイル指定するの人間の仕事じゃなくないですか？」
vv「atom-typescriptはfilesGlobを解釈して展開してくれるんだよなぁ」
laco「じゃあgulpとかGruntからglob与えてtsconfig.jsonのfilesに展開したらよくないです？」
vv「正しそう！」
ということで作った。ちなみにGrunt版はvvakameさんが作った。
grunt-tsconfig-update
https://www.npmjs.com/package/grunt-tsconfig-update
出来上がったもの
こういう状態で
├── gulpfile.js
└── src
├── bar.ts
└── foo.ts
gulpでこうすると
var gulp = require("gulp");
var tsConfig = require('gulp-tsconfig-update');
gulp.task('tsConfig', function() {
return gulp.src("./src/**/*.ts")
.pipe(tsConfig());
});
これが出てくる。
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"declaration": false,
"noImplicitAny": true,
"removeComments": false,
"noLib": false,
"preserveConstEnums": false,
"suppressImplicitAnyIndexErrors": false
},
"files": [
"./src/bar.ts",
"./src/foo.ts"
]
}
./tsconfig.jsonが既に存在していればfilesだけ上書きして、存在しないならデフォルトのcompilerOptionsを設定して書き出す。
嬉しい事
「どのファイルをコンパイルするか」という責任と「どうコンパイルするか」という責任を分割して適切に委譲できた気がする。
gulp-typescriptやgulp-tsを使うのは一見楽(？)でいいのだけど渡したオプションがどう処理されてコンパイルされるのか、自分が指定したオプションが適切に反映されているのかを保証するにはソースを読むしかなくて、加えてtscのアップデートに対応できているのか、メンテされているのかという心配でストレスが少し増える。
そこでtsconfig.jsonを使うようにすることでtscだけに依存するビルド環境になった。
「gulp-tsconfig-updateに依存してるじゃん」というのは、何かが起きても手でJSON編集すればいい話なのでそこまで問題じゃないと思っている。「このプラグインが壊れると開発が止まる」という相手を極力減らすことが重要だという認識。背中を預ける相手はできるだけ少なくしたい。
学び
gulpプラグインは比較的楽にTypeScriptで書けた
基本的なモジュールは型定義ファイルがある。
- node.d.ts
- gulp-util.d.ts
- through.d.ts
- vinyl.d.ts
- gulp.d.ts
のおかげでだいぶ捗った。
map-stream.d.tsがなかったのがつらかったけどフィーリングでなんとかなった。
まとめ
Issue, PR, その他フィードバックお待ちしてます。