LoginSignup
81
51

More than 3 years have passed since last update.

TypeScript未対応のモジュールをimportするときのエラー対策

Posted at

TypeScript未対応のモジュールをimportしようとするとこのようなエラーになります。

Could not find a declaration file for module 'blueimp-load-image'. 'node_modules/blueimp-load-image/js/index.js' implicitly has an 'any' type.
Try `npm install @types/blueimp-load-image` if it exists or add a new declaration (.d.ts) file containing `declare module 'blueimp-load-image';`  TS7016
g

回避策

1.require を使う

const loadImage = require("blueimp-load-image")

2.無視する

//@ts-ignore
import * as loadImage from "blueimp-load-image";

3.全てをanyとして扱う

.d.tsファイルにモジュールを定義する

declare module "blueimp-load-image";

4.定義を書く

// .d.ts (記事のため全部書くのが面倒なので全部 any を使用)
declare module "blueimp-load-image" {
  export function parseMetaData(file: any, 
                                callback: (data: any) => void, 
                                options?: {[key: any]: any}, 
                                data?: {[key: any]: any});
  function loadImage(file: any, callback: any, options?: any): any;
  export default loadImage;
}



// .ts
import {default as loadImage, parseMetaData} from "blueimp-load-image";

どれにするか?

  • 1 は import と requre が混在してしまうので使いたくない
  • 2 は使う場所が多いと面倒なので使いたくない
  • 3 は全部 any になるためタイプチェックが効かないため極力使いたくない
  • 4 は面倒だけど安全なので極力これにしたい

他にあれば教えてください。

81
51
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
81
51