はじめに Dwango でニコニコ生放送のフロント開発を担当している misuken です。 今回は TypeScript で T 型、つまり Generics(総称型)のオブジェクト(props 等)を spread operator で {...props} した際、事実上型チェックが機能しなくなる罠の話をしたいと思います。 Generics(総称型)のオブジェクトが対象なので T 以外の U などでも条件さえ整えば発生します。 React のコードを例に挙げますが、React だけで発生する問題ではないのでご注意ください。 Generics を使わない推論の例 まずは Generics を使わないパターンで期待通りに動作する例を見ていきます。 export const Component1: VFC<{ id?: string }> = (props) => { return ( <