TypeScript で「can only be default-imported using the esModuleInterop flag」(TS1259) が消えない
CommonJS モジュールを default import で読むには esModuleInterop が要る。
tsconfig で esModuleInterop を true にするか、import * as 形式へ書き換える。
公開:
要約
Module '"express"' can only be default-imported using the 'esModuleInterop' flag(TS1259)は、CommonJS で書かれたモジュールを import express from 'express' の default import で読もうとしたときに出る。
CommonJS には ES Modules の default export が無いため、TypeScript は互換のための shim を挟む esModuleInterop を要求する。
tsconfig でこのフラグを立てるか、import * as 形式に書き換えれば解消する。
よくある原因
- CommonJS パッケージ:
expressや旧来の Node 向けライブラリは CommonJS で default export を持たない。 - フラグ未設定:
esModuleInteropが false のまま default import を書いている。 - allowSyntheticDefaultImports だけ有効: 型エラーは消えても実行時の相互運用は担保されない。
解決策
1. esModuleInterop を有効化する
{
"compilerOptions": {
"esModuleInterop": true,
"module": "commonjs"
}
}これが推奨。
CommonJS/ESM の相互運用が正しく処理され、default import と namespace import の両方が期待通りに動く。
2. namespace import に書き換える
import * as express from 'express';
const app = express();フラグを変えたくない場合は、default import をやめて namespace import にする。
3. 影響範囲を確認する
esModuleInterop を true にすると allowSyntheticDefaultImports も暗黙で有効になる。
既存の import * as 表記は動き続けるので、通常はフラグ有効化が最も影響が小さい。