karma-browserify と tsify を使ってテストしたいけど tsconfig.json 書きたくないって時にどこに設定書くか。

karma-browserify 使って typescript テスト

かなり限定的だけど、typescript でコード書いて、browserify でコードくっつけてる時に、テスト書きにくい。

そんな時、karma-browserify と tsify 使えばハッピーになるんだけど、
まれにコンパイルの設定をテストと本番で別にしたくて、
tsconfig.json 書きたくないわーってなる時がある。　あるよね？

そんな時、tsify に設定をどうやって流し込むかって話。

普通に設定を tsconfig.json に書くとき

karma.conf.js

(省略)
    frameworks: ['browserify','jasmine'],

    files: [
        'spec/dir/**/*.ts'
    ],

    preprocessors: {
      'spec/dir/**/*.ts': ['browserify']
    },

    browserify: {
      extensions: ['.ts'],
      plugin: ['tsify']
（省略）

関係あるところ抜き出すとこんな感じ。
同じディレクトリに tsconfig.json を置いておくと、 tsify は勝手にそれを読んで
良い感じにしてくれる。

設定を外に出すのは良いことだし、推奨は多分そのやり方なんだけど、
tsconfig.json で一括に設定したくないって時は個別に設定必要がある。

karma.conf.js 内にコンパイル設定を書くとき

karma.conf.js

(省略)
    frameworks: ['browserify','jasmine'],

    files: [
        'spec/client/**/*.ts'
    ],

    preprocessors: {
      'spec/client/**/*.ts': ['browserify']
    },

    browserify: {
      extensions: ['.ts'],
      configure: function (bundle) {
        bundle.on('prebundle', function () {
          bundle.plugin('tsify', {target: 'ES5'})
        })
      }
    },
（省略）

つまり、 browserify に書いてた plugin を configure で書き換えちゃったらええね。
今回は target:'ES5' だけ設定してるけど、他の値も設定出来ると思う。