TypeScript 2.0 is now available! - TypeScript ということで、自分のプロジェクトのTypeScriptを1.8.9から2.0.3に上げた。あんまり困ったことはなかったけど、少しだけハマったのでメモ。
コンパイルを通すための対策
readonly property対策
今のプロジェクトは基本的に全てのファイルのユニットテストを書くという方針でやっているのだけど、いろんなテストを書こうとするとどうしても基本的には変更できないプロパティへの代入や、関数のモックなどをしたくなる。例えばwindowのinnerWidthを変更したり、_.throttleを置き換えたりである。
window.innerWidth = 800; _.throttle = ...;
もともとTypeScript 1系のときは、このような代入をしても特に怒られなかった。しかし、2系では代入するとコンパイルエラーになるようなreadonly propertyというものができた。例えば以下のようなものがreadonlyになる。
- interface定義でreadonlyと宣言されたproperty
- window.innerWidthはこれにあたる
- readonly innerWidth: number; と宣言されている
- import文で定義されたエンティティ
- lodashはこれにあたる
- import * as _ from "lodash";
詳しくは、https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript#read-only-properties-and-index-signatures を参照のこと。
このreadonly propertyによって、先に紹介したinnerWidthへの代入などがコンパイルに通らなくなった。これの解決を雑にやるならany型にキャストしてあげれば良いので、次のようにしてとりあえず解決した。
(<any>window).innerWidth = 800; (<any>_).throttle = ...;
File name ... differs from already included file name ... only in casing対策
1系を使っていたときから、もともとコンパイルオプションではforceConsistentCasingInFileNamesというコンパイルオプションをtrueにしていて、ファイル名の大文字小文字を区別するようにしていたのだが、1系のときはエラーにならなかったのに2系に上げたら突然エラーが出始めた。適当にエラーメッセージは書き換えているけど、以下のようなエラーが起こる。
File name '/users/shibayu36/development/src/github.com/hogeproject/src/ts/hoge.ts' differs from already included file name '../../../../../../../Users/shibayu36/development/src/github.com/HogeProject/src/ts/Hoge.ts' only in casing
特にHoge.tsをhoge.tsとしてアクセスする部分はなかったのだけど、このようなエラーが出てしまう。
コンパイラのコードを少し追いかけてみたのだけど、なぜこうなるのかというのがちゃんとわからなかったので、仕方なくforceConsistentCasingInFileNamesをfalseにする対応をした。いい方法があったら知りたい。
最終確認
最終的にビルドをしたら、コンパイル結果が変わらなかった。ということで完了ということにした。
今後の予定
今後は2.0に新しく入った機能を徐々に入れていきたい。例えば
- 型ファイルをnpmで管理する
- strictNullChecksの有効化
- noUnusedLocalsやnoUnusedParametersの有効化
などを入れたい。
