VS Code中.js文件未提示ts(2307)找不到模块错误如何解决

核心原因 #

.ts文件的模块路径错误提示由TypeScript语言服务默认提供，.js文件需要显式开启TypeScript对JS文件的校验规则，才会触发同类提示。当前配置仅允许TS加载JS文件，但未开启JS文件的校验逻辑，因此不会抛出路径错误。

修复步骤 #

• 修改项目根目录的tsconfig.json，在compilerOptions节点下补充必填配置，原有配置全部保留即可：

  {
      "compilerOptions": {
          "target": "ES5",
          "module": "commonjs",
          "lib": ["es2017", "dom"],
          "allowJs": true,
          // 新增核心配置
          "checkJs": true,
          "jsx": "react",
          "noImplicitAny": false,
          "noFallthroughCasesInSwitch": true,
          "moduleResolution": "node",
          "allowSyntheticDefaultImports": true,
          "esModuleInterop": true,
          "skipLibCheck": true,
          "outDir": "lib"
      },
      "include": ["./**/*"]
  }
  

  checkJs: true是让TypeScript语言服务接管.js文件校验的核心开关，缺失该配置时TS不会扫描JS文件里的导入路径、类型相关错误。如果不需要JS文件的未使用变量、隐式any这类额外报红，可以配套加"noUnusedLocals": false配置减少干扰。

• 重启VS Code的TypeScript服务让配置生效

  1. 打开任意项目内文件，按快捷键Ctrl+Shift+P（macOS系统按Cmd+Shift+P）调出命令面板
  2. 输入并执行TypeScript: Select TypeScript Version，选择项目本地安装的TypeScript版本（如果未安装本地TS，先在项目根目录执行npm install typescript --save-dev）
  3. 再次调出命令面板，输入并执行TypeScript: Restart TS Server，等待服务重启完成

异常排查 #

如果完成以上配置后仍不提示错误，逐一检查以下项：

• 确认tsconfig.json的exclude节点没有把需要校验的.js文件目录排除在外，当前配置的include规则无问题
• 检查VS Code工作区设置，确认没有把"javascript.validate.enable"、"typescript.validate.enable"项在工作区层级覆盖为false
• 确认目标.js文件头部没有添加// @ts-nocheck注释，该注释会跳过当前文件的所有TS校验

内容的提问来源于stack exchange，提问作者Christiaan Westerbeek