[解決済み] esModuleInterop が true の場合、明示的に allowSyntheticDefaultImports を使用して TypeScript transpilation を構成する必要がありますか?
質問
以下の説について確認が必要です。によると TSドキュメント で設定できるオプションは2つあります。 tsconfig.json .
-
--allowSyntheticDefaultImports を指定します。 デフォルトエクスポートがないモジュールからのデフォルトインポートを許可します。これはコード生成には影響せず、型チェックにのみ影響します。
-
--esModuleInterop: 実行時のバベルエコシステムの互換性のために __importStar と __importDefault ヘルパーを発行し、タイプシステムの互換性のために --allowSyntheticDefaultImports を有効にします。
ググってみると、両方が設定されているようです。 真 (少なくとも私が目指している動作に関しては)。しかし、私がドキュメント、TS、JSへのトランスピレーションを理解する限り、それらを両方使用することは意味がありません。
私の考えだと、後者だけを使い、前者を完全に削除するかもしれません。しかし、慎重で謙虚な私は、完全に確信があるわけではなく、今のところ気づかないうちに明るくないことをやっているのではないかと心配しているのです。
このような不謹慎なことをすると、後々ロバに噛み付かれ、何時間も嘆きながら必死にトラブルシューティングをすることになりそうで怖いです。懐疑的な根拠は、両方の選択肢があることなので、4つのケースで全ての組み合わせ( 真/偽 など)が必要なのですが、どれがそうなのか想像がつきません。
を飛ばしても全く問題ないでしょうか? --allowSyntheticDefaultImports もし --esModuleInterop: true で コンパイラーオプション ? また、その場合、なぜそのようなオプションがあるのでしょうか?
おまけの質問:4つの組み合わせすべてで必要になるのはどんなときか( 真/偽 という2つの選択肢について教えてください。
どのように解決するのですか?
もし、あなたが、このまま
allowSyntheticDefaultImports
を未定義にし
esModuleInterop
の場合、答えはYESになるはずですが、これには問題がありました。
PR #26866
は修正されたようですが、9月17日にマージされただけなので、短期的にはリスクがあるかもしれません。
なぜ両方が存在するかというと、これらは両方とも Babel-transpiled モジュールのインポートに関する互換性の問題に対処するための一部だと思います。最初の PR では特定のコンパイル時のメッセージに allowSyntheticDefaultImports オプションを追加しましたが、実際にはインポートの実行時の動作に対処していませんでした。 そこで、後から --esModuleInterop が追加されました。 参照 TypeScript-ハンドブック/#816 docsの更新方法については...
関連
-
[解決済み】Uncaught ReferenceError: angular is not defined - AngularJSが動作しない。
-
[解決済み] Uncaught TypeError: 未定義のプロパティ 'top' を読み込めない
-
[解決済み】getElementByIdはnullを返す?[クローズド]
-
[解決済み】 Uncaught Error: Invariant Violation: 解決済み】 Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function but got: object.
-
[解決済み] Uncaught (in promise) TypeError: フェッチに失敗してCorsエラー
-
[解決済み】tsconfigファイルにおけるesModuleInteropの理解
-
[解決済み] (a== 1 && a ==2 && a==3) が真に評価されることはあるのでしょうか?
-
[解決済み] モバイルブラウザの検出
-
[解決済み] Reactのstateとpropsの違いとは?
-
[解決済み】JavaScriptでスクロール時のウィンドウのX/Y位置を取得する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】Heroku:ノードアプリで「このアプリにはデフォルトの言語が検出されませんでした」エラーがスローされる
-
[解決済み】このエラーの原因は何ですか - "Fatal error: ローカルgruntを見つけることができません"
-
[解決済み】Uncaught TypeError: nullのプロパティ'value'を読み取ることができない
-
[解決済み】JavaScript "Uncaught TypeError: object is not a function" 連想性の質問
-
[解決済み】「Uncaught TypeError: Chromeで "Illegal invocation "が発生する。
-
[解決済み】SyntaxError: JSON の位置 1 に予期しないトークン o があります。
-
[解決済み】Syntax error: JavaScriptの不正なreturnステートメント
-
[解決済み】TypeError: AngularJSで未定義のプロパティ'get'を読み取れない
-
[解決済み】Vueが定義されていない
-
[解決済み】module.exports "モジュールが定義されていません"