Typescriptでの@typesメンテ不備の対応

ReactでTypescript開発をした際にハマったのでめも。
react-data-gridが便利そうだったので@types/react-data-gridも合わせてnpm innstall --saveでインストールしてみたのだがreact-data-gridで定義されている関数がTypescriptで利用することができなかった。
@typesで定義をみてみたが確かに関数の定義が反映されていないのが原因の様であった。

@typesの方ではいつ対応されるかわからないので、とりあえず以下の対応で使える様にしました。 - @types/react-data-gridの定義はバックアップを取っておく - node_modulesにある@typesの定義をアンインストール

npm uninstall --save @types

  • tsconfig.jsonのcompilerOptionsにpathとbaseUrlを追加する。pathに静的型づけの定義ファイルの配置先を設定し、baseUrlはとりあえず空にして以下の様に設定しました。
{
   "compilerOptions": {
       "outDir": "./dist/",
       "sourceMap": true,
       "noImplicitAny": true,
       "module": "commonjs",
       "target": "es5",
       "jsx": "react",
       "baseUrl": ".",
       "paths": { // 自作jsライブラリ使用のためのTypescript定義ファイル置き場所
           "*": ["./ts-def/*"]
        }

   },
   "include": [
       "./src/**/*"
   ]
}
  • pathsに設定したディレクトリに@types/react-data-gridのバックアップをコピーし、利用したい関数の定義を追加する。