从CommonJS导入ES模块文件的TypeScript

Question

我试图导入一个包，它的package.json指定了"type": "module"。 我看到了Can Typescript import CommonJS Modules?，但它的解决方案（--allowJs）对我不起作用。

我尝试在我的tsconfig.json中设置各种值，如module，moduleResolution和allowJs。 esModuleInteropt和allowSyntheticDefaultImports都设置为true。

我尝试使用import ... from，import(...).then()，import ... = require(...)以及将我的index.js和包的index.js重命名为index.cjs。 当我在node中运行时，它们都导致相同的错误：

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: E:\src\...\node_modules\stringify-object\index.js
require() of ES modules is not supported.
require() of E:\src\...\node_modules\stringify-object\index.js from E:\src\...\index.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename E:\src\...\node_modules\stringify-object\index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from E:\src\...\node_modules\stringify-object\package.json.

我尝试从包的package.json中删除"type": "module"，但它依赖其他具有"type": "module"的包。

上次我尝试弄清楚这个问题时，最终放弃并选择了另一个包。 这真的不应该是一件难事。

- dx_over_dt

---

“这真的不应该是难事。” 是的，我们现在正处于从旧方式转向新方式的尴尬阶段。最终它会再次变得简单，但是...新方式必须有不同的好理由，但仍然很痛苦。对于包作者来说，这种痛苦甚至是双倍或三倍的。 - T.J. Crowder

Answer 1

我找到了一个可行的解决办法。如果我在tsconfig.json中设置"module": "ESNext"并将输出重命名为index.mjs，它就能正常工作。虽然不是特别优雅，但总归是一种方法。一定有更好的方法。

我很乐意接受其他更好的答案。

---

正如评论中指出的那样，在我的项目的package.json中设置"type": "module"，这样我就不需要将index.js重命名为index.mjs。

- dx_over_dt

---

如果在你的 package.json 文件中加入 "type": "module"，那么你就不需要使用 .mjs 扩展名了。上面的操作是告诉 TypeScript 使用 ESM（原生 JavaScript 模块）而不是 CommonJS。因此，如果你通过 package.json 告诉 Node.js 这就是你要做的事情，你就不需要使用文件名来告诉它了。 - T.J. Crowder

啊，我在设置模块：esnext之前尝试过那个，也许那样就可以了。 - dx_over_dt

这对我没有起作用。有什么建议吗？ - Ahsan

@Ahsan，你在package.json中设置了"type": "module"，并在tsconfig.json中设置了"module": "ESNext"吗？ - dx_over_dt

@dx_over_dt... 是的，我也尝试过了。 - Ahsan

@Ahsan，你是否在使用像webpack或rollup这样的打包工具？ - dx_over_dt