型定義ファイルのないライブラリのインポートエラーについて

5348 ワード

はじめに

TypeScriptを使用したプロジェクトで、型定義ファイルがないJavaScriptライブラリを使用すると以下のような警告が出ます。

モジュール '{モジュール名}' の宣言ファイルが見つかりませんでした。'{モジュール名}' は暗黙的に 'any' 型になります。
存在する場合は `npm i --save-dev @types/{モジュール名}` を試すか、`declare module '{モジュール名}';` を含む新しい宣言 (.d.ts) ファイルを追加します

警告の対処法と、そもそも d.ts ファイルがなんなのかについて記していきます。

結論

対処法の結論を先に記載すると、警告文にあるように、declare module '{モジュール名}'; を含む新しい宣言 (.d.ts) ファイルを追加 することで解決できます。

実例を参考に手順を説明していきます。

今回、types対応していないJavaScriptライブラリとしてGio.jsを使用しており、Gio.js のインポート節でエラーが出ていました。

index.tsx
import * as GIO from "giojs";


Gio.js はTypeScript用の型定義ファイルが用意されていないので、エラー文にある

npm i --save-dev @types/{モジュール名}

は使用できません。

よって declare module '{モジュール名}'; を含む新しい宣言 (.d.ts) ファイルを追加 を試します。

任意のディレクトリ階層に以下の giojs.d.ts を新規作成しました。

giojs.d.ts
declare module "giojs";

これでエラーは出なくなります。

そもそもd.tsファイルって何?

詳しくはサバイバルTypeScriptで解説されていますが、d.ts ファイルは型定義ファイルのことを指します。