TypeScript のトランスパイルを babel に任せる


モチベーション

TypeScript でも babel-preset-env などの babel エコシステムにのりたい。

やり方

babel 7 から TypeScript のパースも出来るようになったのでそれで行う。

@babel/preset-typescript をインストールして .babelrc に設定する。

sh
yarn add -D @babel/preset-typescript
.babelrc
{
  "presets": [
    "@babel/preset-typescript"
  ]
}

以上

落とし穴

実はこれだけだと型がおかしい場合などにコンパイルエラーが起きない。
開発中はエディタなり IDE なりでエラーが出せるとは思うが、型があるのに型エラーが出ないのは何のための型なのかわからない。
なのでテストなりトランスパイルの前にコンパイルが通るかチェックする必要がある。

package.json
{
  "scripts": {
    "test:compile": "tsc --noEmit"
  }
}

エディタなどに支援されているがために気づかず怖いことになってしまいそう (๑•́‧̫•̀๑)