【Typescript】当moduleResolution= “Node16“时，import()方法导入的相对路径必须包含扩展名【而moduleResoluti=“bundler“时可以省略扩展名】

最新推荐文章于 2025-05-04 18:55:58 发布

原创最新推荐文章于 2025-05-04 18:55:58 发布 · 1.9k 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#ecmascript #前端 #开发语言

文章讲述了在TypeScript中，当使用--moduleResolution选项设为node16或nodenext时，ECMAScript风格的import语句需要包含文件扩展名。解决方法包括确保import语句正确，检查tsconfig.json配置，以及理解moduleResolution选项的不同设置对项目的影响。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

错误提示：error TS2835: Relative import paths need explicit file extensions in ECMAScript imports when '--moduleResolution' is 'node16' or 'nodenext'

参考：Relative import paths need explicit file extensions in EcmaScript imports | Total TypeScript

参考官方手册：TypeScript 中文网: TSConfig Reference - Docs on every TSConfig option

这个 TypeScript 错误 TS2835 是关于模块解析的，它发生在你的 TypeScript 配置中使用了 --moduleResolution 选项设置为 node16 或 nodenext 时。在这些模块解析策略下，当你使用 ECMAScript 风格的 import 语句进行模块导入时，必须在相对路径中包含文件的完整扩展名。

例如，如果你的项目中有一个名为 example.ts 的文件，并且你想导入它，那么导入语句应该是这样的：

typescript
Copy code
import { something } from './example.js';
即使你在 TypeScript 中导入 .ts 文件，你也需要在 import 语句中使用 .js 扩展名。这是因为当 TypeScript 代码被编译成 JavaScript 后，它实际上会寻找 .js 文件。

要解决这个问题，请确保你的所有 ECMAScript 风格的 import 语句都包含了正确的文件扩展名。这可能会感觉有点反直觉，因为在编写代码时，你实际上是在引用 .ts 文件，但这是确保 TypeScript 正确编译代码并使 Node.js 正确解析模块的必要步骤。

此外，如果你在编译 TypeScript 时遇到问题，可以检查你的 tsconfig.json 文件的配置，确保 compilerOptions 中的 moduleResolution 和 module 选项适合你的项目设置和目标运行环境。对于使用最新 Node.js 版本的项目，通常推荐的设置是 "moduleResolution": "node16" 或 "nodenext"，以及 "module": "ESNext"。

注意：当前使用相对路径动态导入时【import(相对路径)方法时】必须配置moduleResolution='bundler' 省略后缀名.js或.ts时才能正常运行！

moduleResolution='bundler' 与捆绑器一起使用。与node16和nodenext一样，此模式支持package.json“导入”和“导出”，但与Node.js解析模式不同，bundler从不要求导入中相对路径上的文件扩展名。