nodejs trouble shooting typescript

Typescript3.0以下の環境で発生する「Cannot find name ‘unknown’」に対処する

投稿日:2019年6月9日

事象

Typescript2.3.4を使っている息の長いWebシステムでnpm installをし直し、tscビルドし直したらトランスパイルエラーが発生。「unknown」という型を見つけられませんとwebpack越しにtscコマンドがこけます。

[14:27:05]  transpile started ...
[14:27:25]  typescript: C:/src/pwa/awsomeapp/node_modules/raven-js/typescript/raven.d.ts, line: 205
            Cannot find name 'unknown'.

     L206:       * Manually send a message to Sentry

原因

unknown型はTypescript3から実装されている型なので、Typescript2環境では使えません。自分のコードで使っていなくても、npm installした依存モジュールが使っている場合、tscトランスパイルに失敗します。

今回の場合、エラーログ収集サーバであるSentryに対してフロントからエラーログを投げる為に入れているraven-jsで発生しました。npm installし直したことでraven-js@3.26.2から3.27.1にバージョンが上がり、この過程で開発元がTypescript3を使い始めたのかタイプ定義(raven.d.ts)内でunknown型を使用していました。

    captureException(
      ex: unknown,  ← これ
      options?: RavenOptions
    ): RavenStatic;

結果、Typescript2環境では事象のトランスパイルエラーが発生してしまいます。

対処

unknown型を解決出来るpolyfillを入れます。

$ npm install unknown-ts --save-dev
+ unknown-ts@0.1.0
added 1 package and removed 1 package in 66.533s

後は読み込みルートになるts(ionicやangularであればapp.modules.tsとか)に以下を入れればunknown型が使えるようになります。

import "unknown-ts";

再度ビルド実行して事象のエラーが発生しなくなることを確認します。

まとめ

インストールしたunknown-tsの内容はたったこれだけです。

export type mixed = { [key: string]: any } | object | number | string | boolean | symbol | undefined | null | void

declare global {
  type unknown = mixed
}

これと同じ記述を読み込みルートになるtsに書いてあげればunknown-tsをインストールしなくても解決します。

ですがTypescriptは2系のままの環境でも、tslintのバージョンは結構上がっていたりしてunknown型のことを知っていて、新規にunknown型を定義しようとすると今度はtslintに注意されるハメになります。

ビルドは通るようにはなりますが、VSCode上でtslintエラーが表示されてしまうのは精神的にスッキリしないので、素直にunknown-tsを入れて今はそっと蓋をしました。

Typescriptを3系に上げたらnpm uninstallするのを忘れないようにしないとですね。

-nodejs, trouble shooting, typescript

執筆者:

関連記事

キャッシュされているはずのServiceWorker資源にオフラインアクセス出来ない(Workbox + ionicons)

そのHTTPリクエストしたファイル資源、ひょっとしてURLパラメータついてたりしませんか? 目次1 事象2 原因3 対処 事象 ionic3(SPA)でWorkboxを使ったServiceWorker …

java.security.InvalidKeyException: IOException : DerInputStream.getLength(): lengthTag=111, too big.

目次1 事象2 原因3 対処4 得た教訓 事象 OpenSSLで作成した秘密鍵をJava(Eclipse + Maven環境)で読み込み、公開鍵で暗号化されたデータを復号しようとした際に例外が発生しま …

EclipseのXMLエディタ一行目でDTDエラー「参照ファイルにエラーが含まれています」

目次1 事象2 原因3 対処4 まとめ 事象 checkstyleのルールXMLをEclipseで開くと一行目にエラーマーク。 カーソルを合わせた時のメッセージ。 XMLのデータ構造整合性をチェックす …

mkcertとhttp-serverでHTTPS環境を作りAndroid(chrome)、iPhone(safari)から接続

簡単にパーフェクトなオレオレ証明書が作れるとgithub上で人気上昇中の「mkcert」。 GitHub  135 UsersFiloSottile/mkcerthttps://github …

Android用ionic cordovaアプリのビルド時に「Unable to merge dex」エラー

目次1 事象2 原因3 解決4 まとめ 事象 「cordova-plugin-admob-free」を追加した次のビルドで発生。他のケースでも発生する可能性があります。 C:\src\ionic\aw …

 

shingo.nakanishi
 

東京在勤、1977年生まれ、IT職歴2n年、生涯技術者として楽しく生きることを目指しています。デスマに負けず健康第一。