hyperapp V1のComponentがTypeScript3.2以降に対応していない問題と対策

hyperapp V1のComponentは現時点でTypeScript3.2以降に対応していません。

このため、普通に最新のhyperapp V1 (1.2.9) とTypeScript (本記事の執筆時点で3.4.5) をインストールして、Componentを使用したコードをビルドしようとすると、ビルドエラーが発生します。

再現手順

たとえば、naoki tomitaさん作成のhyperapp V1サンプルコードを、最新のTypeScriptをインストールした上でビルドすると、下記のようなエラーが発生します。
（下記実行例は、node.js、git、yarnがインストールされていることを前提としています）

$ git clone https://github.com/naoki-tomita/hyper-sample
$ cd hyper-sample
$ yarn
(このときにpackage.jsonの記述に従い、TypeScript 3.2.2がインストールされる)

$ yarn tsc -p .
yarn run v1.15.2
$ C:\temp\hyper-sample\node_modules\.bin\tsc -p .
index.tsx:31:5 - error TS2605: JSX element type 'VNode<Attributes> | View<State, Actions>' is not a constructor function for JSX elements.
  Type 'View<State, Actions>' is missing the following properties from type 'Element': nodeName, children, key

31     <Up by={2} />
       ~~~~~~~~~~~~~

index.tsx:32:5 - error TS2605: JSX element type 'VNode<Attributes> | View<State, Actions>' is not a constructor function for JSX elements.
  Type 'View<State, Actions>' is not assignable to type 'Element'.

32     <Down by={1} />
       ~~~~~~~~~~~~~~~

index.tsx:33:5 - error TS2605: JSX element type 'VNode<{}> | View<State, Actions>' is not a constructor function for JSX elements.
  Type 'View<State, Actions>' is not assignable to type 'Element'.

33     <Double />
       ~~~~~~~~~~


Found 3 errors.

対策

naoki tomitaさんの修正版fork (improve-types-for-ts3.2.2 ブランチ) を使用することで、TypeScript 3.2以降でもhyperapp V1を使用することが可能です。

たとえば、yarnを使用しているのであれば、下記コマンドでnaoki tomitaさんの修正版forkをインストールし、ビルド時にエラーが発生しないようになります。

$ yarn add https://github.com/naoki-tomita/hyperapp#improve-types-for-ts3.2.2

（package.jsonにも修正版forkをインストールするように記録されるため、次回以降はyarnの実行だけでインストール可能です）

hyperapp V1のソースに上記の修正版forkが取り込まれればこの問題は解決すると思うのですが、今のところは作者のjorgebucaran氏が新バージョンであるV2へ尽力されているため（→参考Issue）、V1への対応はかなり後になるか、もしくはこのままサポート対象外となってしまうことも予想されます。
そのため、当面は状況を見守りつつ、naoki tomitaさんの修正版forkを感謝しながら使用させていただくしかないのではないかと思われます。