Speakers

Vueトラック06:20〜06:50

Vue SFCのtemplateでTypeScriptの型を活用しよう

Vue SFCのtemplateは一見scriptとは分離されているように見えますが、Vue Language Toolsの力を借りることによってtemplate上で型のnarrowingをしたり、型推論したりすることができます。さらに、Volar Labs https://volarjs.dev/core-concepts/volar-labs/ というVSCode Extensionを使うことでどのように型が解釈されているかを確認することもできます。 そこで、上記の特徴を使って、template上で条件分岐の網羅性をチェックする方法や、defineSlotsマクロを通じてgenericなslotを定義する方法などを共有しつつ、Vue SFCのtemplate上でどのように型が解釈されているかを探ります。
tsukkee

ストックマーク株式会社

チームリード

tsukkee

Stockmark株式会社でチームリードとしてマネージメントしつつ、プロダクトの開発もしています。最近はプロダクト進化のための持続可能なソフトウェア開発に興味があります。好きなエディタはVim、好きなブラウザはFirefoxです。