PolymerとTypeScriptの相性が悪い
2015/10/16時点での所見をまとめておく
TypeScriptで書く
pros
- TypeScriptに慣れてる
- ES6 classが使える
現状
"use strict"; export default class HelloWorldComponent { is: string; beforeRegister() { this.is = "hello-world"; } } Polymer(HelloWorldComponent);
cons
- HTMLファイル中に直接書けないのでファイルが分離される(設計上どうかは別にしてロジックを書きながらテンプレートが見れないのは不便)
- Polymer(というかCustom Elements)の設計がTypeScriptと噛み合ってない
Polymerの型
Polymer()
に渡すのはプロトタイプである。(JavaScriptのprototypeではない)Polymer()
に渡すのは実装全体ではなく一部Polymer()
に渡した後desugar(解糖)され、Polymerが提供する多数のbehaviorとmixinされる- ↑の理由により、プロトタイプの時点と実行時に自身が持つメンバが違う
- ↑の理由により、PolymerのプロトタイプをTypeScriptのclassにすると
this.
でPolymerのAPIが使えない - Polymerは動的にフィールドを増やすことが多々あるので interfaceでのチェックの意味が薄い
理想
こうしたい
"use strict"; export default class HelloWorldComponent extends polymer.BaseClass { beforeRegister() { this.is = "hello-world"; } ready() { this.$.name.textContent = "foo"; } } Polymer(HelloWorldComponent);
polymer.d.tsは今のところ純粋にPolymerの実装に型を与えただけで、インタフェース以外は提供していない。classはPolymer本家に実装されていないので、それやっちゃうと型定義じゃなくてライブラリになっちゃうかなあと思っている。
ところで PolymerTS というライブラリがある
Decoratorも使いまくってAPIはけっこういい気がするんだけど、作者がVisualStudioで書いてるっぽくてリポジトリの汚いのとコードの書き方が相容れないのでコントリビュート意欲を削ってくる。こんな感じのもうちょっと薄くて自分が使いやすいライブラリを作る予定ではあるがなかなか時間と体力がない。今年中にやりたい。