やって来る Vue 2.5 での TypeScript の変更

Sep 23, 2017

このブログはこちらの翻訳ブログです。

型定義の改善

私たちは Vue 2.0 のリリース以来、よりよい TypeScript 統合を求められています。リリース以来、私たちはほとんどのコアライブラリ (vue, vue-router, vuex) のための公式の Typescript の型定義を含めました。しかし、Vue API をそのまま使用するとき、現在の統合は幾分不足しています。たとえば、 TypeScript は Vue が使用するデフォルトのオブジェクトベースの API 内部の this の型を簡単には推論できません。 Vue のコードを TypeScript でうまく操るためには、 vue-class-component デコレータを使用する必要があり、これによってクラスベースの構文を使用して Vue コンポーネントを作成することができます。

クラスベースの API を好むユーザーの場合はこれで十分でしょうが、型推論のために異なる API を使用しなければならないというのはちょっと残念です。このことはまた既存の Vue コードベースを TypeScript に移行することをより困難にしています。

今年初め、 TypeScript は多くの新機能を導入し、 Vue の型定義を改善して TypeScript がオブジェクトリテラルベースの API をよりよく理解できるようにしました。 TypeScript チームの Daniel Rosenwasser野心的な PR(今はここでコアチームメンバーの HerringtonDarkholme によってメンテされています)を開始しました。いったんマージされると、以下が提供されます:

動作中の VSCode + Vetur + 新しい型定義

動作中の VSCode + Vetur + 新しい型定義

興味のある方は、この遊び場プロジェクトを clone して(new-types ブランチをチェックアウトしてください)VSCode + Vetur で開くことで今すぐ試すことができます!

TypeScript ユーザーが潜在的に求められる対応

型定義のアップグレードは今のところ 10 月上旬にリリースされる予定の Vue 2.5で出荷される予定です。 JavaScript の公開 API に破壊的な変更がないためマイナーリリースでリリースしていきますが、このアップグレードは既存の TypeScript + Vue ユーザーにいくつかの対応を潜在的に要求します。これが今の段階で変更を発表する理由で、アップグレードの計画に十分な時間を確保できるようにするためです。

私たちは必要なアップグレード作業を最小限に抑えるためベストを尽くし、これらの型定義の改善は vue-class-component で使用されるクラスベースの API と互換性があります。ほとんどのユーザーは、単に依存関係を更新して ES スタイルのインポートに切り替えるだけです。その間、貴方がアップグレードする準備が整うまで Vue のバージョンを 2.4.x に固定することも私たちはお勧めします。

ロードマップ: vue-cli での TypeScript のサポート

2.5 以降は、私たちは TS + Vue ユーザーが新しいプロジェクトを簡単に開始できるようにするため vue-cli の次のバージョンで TypeScript の公式サポートを導入する予定です。ご期待ください!

非 TypeScript ユーザーの場合

これらの変更は非 TypeScript の Vue ユーザーに悪影響を及ぼすことはありません;セマンティックバージョンにより、 2.5 は公開 JavaScript API に関しては完全に後方互換性があり、 TypeScript CLI 統合は完全にオプトインになります。しかし上記で述べたように、 vue-language-server でのエディタ拡張機能を使用している場合はオートコンプリート提案が気に入るはずです。

Daniel RosenwasserHerringtonDarkholmeKatashinPine Wu
の方々にはこれらの機能への取り組みとこの記事(訳注:原文のほう)のレビューについて感謝します。