ウェブエンジニア珍道中

日々の技術的に関する経験を書いていきます。脱線もしますが助けになれば幸いです。

ts-nodeでCLI上でのtypescriptの検証がめっちゃ楽になった話

typescriptでデザインパターンの勉強をしているのですが、コンパイルがとても面倒くさい。

webpackにts-loader入れてコンパイルして検証をしていたのですが、ts-nodeという便利なモジュールがあったので紹介します。

CLI上で検証・勉強したりするにはとても便利だと思います。

github.com

ts-nodeとは

typescriptのコードを直接node上で実行してくれるものです。自分でコマンド打ってコンパイルする必要がなくなります。

コード書く→コンパイルする→jsを実行する

という流れから

コード書く→.tsのファイルを直接実行する

という流れに変わります。すっげー楽!

使い方

入れます!

npm install -g typescript
npm install -g ts-node

使います!

ts-node hoge.ts

終わりです!簡単ですね!(ゴリ押し)

typescriptモジュールを入れているのはts-nodeが内部的にコンパイルするのに使うからです。

対話式で使う

ファイルを選択しなかった場合はnodeコマンドと同じように対話式に実行するものが開きます。これもtypescriptで動きます。

 ts-node
> var hoge: number = 12;
{}
> console.log(hoge)
12

注意点

現在(2017/11/11)のバージョンでは普通には動かない状態のようです。こんな感じに怒られます。

Thrown: ⨯ Unable to compile TypeScript
[eval].ts: Cannot find name 'exports'. (2304)
[eval].ts (0,11): Cannot find name 'module'. (2304)

動作させるためにはグローバル(-g)ではなくローカルに@types/nodeをインストールして、ローカル上で動かす必要があるようです。

npm install ts-node typescript @types/node # ローカルにインストールする

$(npm bin)/ts-node # 動かす

バージョン4.0で直るとのことなので待機ですね。詳しくはこちら

github.com

ファイルを指定して実行する分には問題なく動くので活用していきましょう!

追記(2018/05/23)

追記時のバージョンは6.0.3でグローバルでも動作することを確認しました。