tsファイルをコンパイルしたjsファイルで"Uncaught ReferenceError: exports is not defined" というエラーが発生する時の解消方法について説明します。初心者による自分用のメモなので参考程度にしてください。

エラーの原因は？

以下の部分でエラーが発生していました。

このエラーの原因は、ES ModulesではなくCommonJSでコンパイルされていることによります。

エラーの解消方法

tsconfig.jsonを編集します。tsconfig.jsonファイルがない場合は、プロジェクトのルートディレクトリで、以下のコマンドを実行します。

次のように書き換えます。

以下のコマンドでtsファイルをjsファイルにコンパイルします。

これで、プロジェクト内の全てのtsファイルがjsファイルにコンパイルされます。

それでも改善しない時は、Webブラウザをスーパーリロード(Chrome: Ctrl + F5)してください。

おわりに

繰り返しになりますが、初心者による自分用のメモなので、参考程度にしてください。

追記

現在はフレームワークのNext.jsを使用しています。コンパイルとか考えなくても自動的にやってくれるので楽です。