TypeScriptでcatch句の変数(error.message)を使おうとするとVSCodeに怒られる件

WASD Inc. 開発チームのmako_jiiです。

今日なんの気なしにVisual Studio Codeのバージョンを更新したのですが、それをきっかけに以下のようなコードで型エラーが出るようになりました。

try {
    ...
} catch (error) {
     console.error(error.message);
}

今までcatch句の変数の型は指定しないとanyだったはずですがいつの間にかunknownになってしまっていて、messageってなんだよ、と怒られてしまっているのが原因みたいです。

なんでかというと最近リリースされたTypeScript 4.4の仕様変更により、catch句変数の型をunknownにするオプションがデフォルトで有効になったからみたいです。

devblogs.microsoft.com

弊社では使用するTSのバージョンをプロジェクトで指定しているので、それを使用するようにしていれば現状は問題は起きません。 (私が最新バージョンを使用するような設定にしていたので今日気付いたんですけどね)

対策方法としては、以下のような対策方法があるかと思います。

①すべてのcatch句変数に正しく型を付けていく

影響範囲でかくてめちゃくちゃ大変そう...

②VSCode公式ブログで書かれているような対処をする。

try {
    executeSomeThirdPartyCode();
}
catch (err) { // err: unknown

    // Error! Property 'message' does not exist on type 'unknown'.
    console.error(err.message);

    // Works! We can narrow 'err' from 'unknown' to 'Error'.
    if (err instanceof Error) {
        console.error(err.message);
    }
}

型チェックをしてからerr.messageを使うようなやり方ですね。

比較的安全かと思いますが、影響範囲の大きい場合は処理の置き換えが必要です。

③VSCodeの--useUnknownInCatchVariablesオプションを無効にする

これを無効にすれば従来どおり型を指定しなければanyになります。

④TypeScript 4.4を使用しない

😭

応急措置として③を選択するパターンが結構多いのではないでしょうか。時間はかかってしまうかもしれませんが、適切な形で今後対処していきたいなと思っています。

(いつTS4.4使うことになるか分からないけど)

それでは！