TypeScriptで「ブロック スコープの変数を再宣言することはできません。」と言われたら

Visual Studio Codeで、TypeScriptを使って開発しているとき、変数名のところに「ブロックスコープの変数 ‘tax’ を再宣言することはできません。」というエラーが発生することがあります。

これは、同じプロジェクト内で同じ変数名を使って宣言した場合に発生するもので、実際に1プロジェクトとして開発している場合には適切なエラーメッセージなため、ブロックを分けたり変数名を変更したり、モジュールにするなどで解決する必要があります。

ただ、単に練習のプログラムを作っていてファイルを分けただけだったり、別々のプログラムの中で反応してしまうということがあり、邪魔に感じることがあります。そんな場合は、「tsconfig.json」でこのチェックを止めることができます。

tsconfig.jsonを作ろう

もしまだ、tsconfig.jsonがない場合は次のコマンドでフォルダ内にtsconfig.jsonを作成します。

tsc init

すると、フォルダ内にtsconfig.jsonファイルができあがります。

moduleDetectionオプションを変更しよう

次に、このtsconfig.jsonファイルをエディタで開き、「moduleDetection」という記述を探します(25行目付近)。

    // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */

最初は行の先頭に「//」が記述されていて、コメントになっているため、これを取り除きましょう。標準ではこの設定が「auto」になっています。これにより、モジュール単位での変数宣言などをチェックしてくれるようになるため、変数名の重複などが指摘されるようになるのです。

そこでこれを「force」として強制にします。すると、すべてのファイルをモジュールと見なしてくれるため、別のファイルに同じ変数名があっても問題ないと判定されます。

"moduleDetection": "force",                        /* Control what method is used to detect module-format JS files. */

これで保存すれば、警告を消すことができます。