如果 esModuleInterop 为 true 配置 TypeScript 转译,我是否需要显式 allowSyntheticDefaultImports?
Do I ever need explicit allowSyntheticDefaultImports if esModuleInterop is true configuring TypeScript transpilation?
我需要确认以下理论。根据TS docs,tsconfig.json.
有两个选项可以设置
--allowSyntheticDefaultImports: 允许从没有默认导出的模块中进行默认导入。这不会影响代码发出,只会影响类型检查。
--esModuleInterop: 发出 __importStar 和 __importDefault 助手以实现运行时 babel 生态系统兼容性并启用 - -allowSyntheticDefaultImports 以实现类型系统兼容性。
当我 google 左右时,我看到两者都设置为 true(至少就我的目标行为而言)。然而,据我了解文档、TS 和转译为 JS,两者都使用是没有意义的。
按照我的想法,我可能只使用后者而完全删除前者。但是,谨慎和谦虚,我不能完全确定并担心我现在没有意识到自己在做一些不那么光明的事情。
我担心这是不恰当的事情,稍后会在驴子上咬我,导致数小时的哀叹和拔毛,同时拼命解决问题。怀疑的基础是两种选择都可用,所以我推断有四种情况需要所有组合(true/false 等),但我可以想象一下它们是什么。
跳过 --allowSyntheticDefaultImports if --esModuleInterop: true in compilerOptions[=41 是否完全安全=]?如果是这样,为什么我们有这个选项?
奖金问题:这两个选项的所有四种组合(true/false)什么时候需要?
如果您的意思是您可以保留 allowSyntheticDefaultImports
未定义并仅定义 esModuleInterop
,答案应该是肯定的,但是这有一个问题。 PR #26866 好像是修复了,9月17号才合并,所以短期内可能会有一些风险。
为什么两者都存在,我相信它们都是解决导入 Babel 转译模块的兼容性问题的一部分,原始 PR 为某些编译时消息添加了 allowSyntheticDefaultImports 选项,但实际上没有解决导入的运行时行为。所以后来添加了--esModuleInterop。有关如何更新文档的讨论,请参阅 TypeScript-Handbook/#816...
嗯,我的理解是 allowSyntheticDefaultImports
是为了能够以更简单的方式加载 CommonJS 库,如果你以 es6+ 为目标(在开发时间),而 esModuleInterop
是为了简化这些导入(在运行时)如果你的目标是 AMD(就像我一样)。
根据文档,如果启用了 esModuleInterop
,则不需要明确指定 allowSyntheticDefaultImports
,但我必须同时启用 allowSyntheticDefaultImports
的原因是 Resharper 似乎在 Visual Studio 中进行语法检查时查看那个标志。当然,它仅使用 esModuleInterop
即可构建并正常工作,但在我还启用另一个标志之前,我从 Resharper 收到了很多红色警告。
根据此处的相关文档:https://webpack.js.org/guides/typescript/, both options have different significance. Based on the project code and dependent library syntax, either/both options may be required.
我需要确认以下理论。根据TS docs,tsconfig.json.
有两个选项可以设置--allowSyntheticDefaultImports: 允许从没有默认导出的模块中进行默认导入。这不会影响代码发出,只会影响类型检查。
--esModuleInterop: 发出 __importStar 和 __importDefault 助手以实现运行时 babel 生态系统兼容性并启用 - -allowSyntheticDefaultImports 以实现类型系统兼容性。
当我 google 左右时,我看到两者都设置为 true(至少就我的目标行为而言)。然而,据我了解文档、TS 和转译为 JS,两者都使用是没有意义的。
按照我的想法,我可能只使用后者而完全删除前者。但是,谨慎和谦虚,我不能完全确定并担心我现在没有意识到自己在做一些不那么光明的事情。
我担心这是不恰当的事情,稍后会在驴子上咬我,导致数小时的哀叹和拔毛,同时拼命解决问题。怀疑的基础是两种选择都可用,所以我推断有四种情况需要所有组合(true/false 等),但我可以想象一下它们是什么。
跳过 --allowSyntheticDefaultImports if --esModuleInterop: true in compilerOptions[=41 是否完全安全=]?如果是这样,为什么我们有这个选项?
奖金问题:这两个选项的所有四种组合(true/false)什么时候需要?
如果您的意思是您可以保留 allowSyntheticDefaultImports
未定义并仅定义 esModuleInterop
,答案应该是肯定的,但是这有一个问题。 PR #26866 好像是修复了,9月17号才合并,所以短期内可能会有一些风险。
为什么两者都存在,我相信它们都是解决导入 Babel 转译模块的兼容性问题的一部分,原始 PR 为某些编译时消息添加了 allowSyntheticDefaultImports 选项,但实际上没有解决导入的运行时行为。所以后来添加了--esModuleInterop。有关如何更新文档的讨论,请参阅 TypeScript-Handbook/#816...
嗯,我的理解是 allowSyntheticDefaultImports
是为了能够以更简单的方式加载 CommonJS 库,如果你以 es6+ 为目标(在开发时间),而 esModuleInterop
是为了简化这些导入(在运行时)如果你的目标是 AMD(就像我一样)。
根据文档,如果启用了 esModuleInterop
,则不需要明确指定 allowSyntheticDefaultImports
,但我必须同时启用 allowSyntheticDefaultImports
的原因是 Resharper 似乎在 Visual Studio 中进行语法检查时查看那个标志。当然,它仅使用 esModuleInterop
即可构建并正常工作,但在我还启用另一个标志之前,我从 Resharper 收到了很多红色警告。
根据此处的相关文档:https://webpack.js.org/guides/typescript/, both options have different significance. Based on the project code and dependent library syntax, either/both options may be required.