VSCode中tsconfig.json的moduleResolution属性报错如何解决？

问题根源 #

moduleResolution: "bundler"是TypeScript 5.0及以上版本才支持的配置项，若你当前VSCode使用的TypeScript版本低于5.0，就会出现无法识别该选项的报错。另外，module与moduleResolution配置不匹配也会引发问题。

解决方案 #

1. 切换VSCode使用项目本地TypeScript版本 #

Next.js初始化项目时会自动安装适配的TypeScript版本（通常≥5.0），需让VSCode使用本地版本而非全局版本：

• 点击VSCode底部状态栏右侧的TypeScript版本号（比如显示4.9.x）
• 在弹出选项中选择Use Workspace Version

2. 修正tsconfig.json的配置组合 #

根据你的Next.js版本，任选以下有效配置：

方案A：保留bundler模式（推荐Next.js 13+）

确保TypeScript版本≥5.0，配置保持：

"module": "esnext",
"moduleResolution": "bundler"

方案B：使用node16/nodenext模式

若需兼容较低TS版本，修改为：

"module": "node16",
"moduleResolution": "node16"

或

"module": "nodenext",
"moduleResolution": "nodenext"

注意：module和moduleResolution的取值必须一致，不能混用。

3. 重启TypeScript服务器 #

修改配置后，按Ctrl+Shift+P（Windows）或Cmd+Shift+P（Mac），输入TypeScript: Restart TS Server，让新配置生效。

4. 更新TypeScript版本（可选） #

打开项目package.json，若typescript版本低于5.0，执行命令更新：

npm install typescript@latest --save-dev
# 或用yarn
yarn add typescript@latest --dev

内容的提问来源于stack exchange，提问作者Kishor Mandve