An import path can only end with a '.tsx' extension when 'allowImportingTsExtensions' is enabled.　というエラーの解決方法について

Posted at 2025-02-13

はじめに

CI/CDを設定後、GitHubのActionsで

An import path can only end with a '.tsx' extension when 'allowImportingTsExtensions' is enabled.

というエラーが表示されました。
翻訳すると「allowImportingTsExtensions」が有効になっている場合、インポートパスは「.tsx」拡張子でのみ終わることができます。とのことで、.tsxという記述が原因のようです。

allowImportingTsExtensionsについて調べると、tsconfig.jsonに以下の記述をすることで.tsxが使えるようになるようです。

tsconfig.json

"compilerOptions": {
    "allowImportingTsExtensions": true
  }

その他の解決方法として、.tsxを削除することでも解決できました。

main.tsx

import App from './App' // ← .tsxを削除