TypeScriptでJavaScriptのライブラリを使おうとした時に‘クラス名’ refers to a UMD global, but the current file is a module. Consider adding an import instead.が出た時の対処法

前回の記事の手順でTypeScriptでJavaScriptのライブラリを使おうとしたところ

‘クラス名’ refers to a UMD global, but the current file is a module. Consider adding an import instead.

が出たのでその原因と対処法。

経緯

  1. vivus.jsというsvgのアニメーションライブラリを前回の記事と同様の手順で使用
  2. typeScript書いてコンパイル
  3. ‘Vivus’ refers to a UMD global, but the current file is a module. Consider adding an import instead.
  4. てぅんてぅんてぅん〜ん(やられ音)

原因

使おうとしたファイルで自分の書いたモジュールをインポートしていたためroot containerがVivusのroot containerと異なったせい。多分。そんな感じ。

ファイルはだいたいこんなん

詳しくはこちらのサイトを参考に

TypeScript の型定義ファイルと仲良くなろう

対処法その1(非推奨):moduleをimportしない

modeuleをimportしなければどちらもgrobal containerがrootになるのでコンパイルは通る。

しかし自分で作ったモジュールをインポートして使えないので不便。今はテストで読み込んだだけなのでいいですが、今後困りますよね。

無理。却下。

対処法その2(おすすめ!):型定義ファイルを書きかえる

Jqueryなら自分のファイルをインポートしてても使えたので型定義ファイルをどうにかすれば使えるはず。ということで見てみました。

という感じになってました。

classにdeclareがついてるならexportいらないのでは…?ということで

てな感じにとりあえずコメントアウトしたら動きました。

コンパイルも通るし補完もきいたしコンパイル後も動きました!めでたい!

あんまり深く理解していませんがまあ型定義ファイルは定義だけなのでコンパイルさえ通ったらとりあえすいいんじゃないかと思います(適当)。

とにかく良かったです。終わり。

ではまた。

にほんブログ村 IT技術ブログへ
スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です