WebStorm 2023.1.2无法识别Nuxt3 TS项目中的defineProps等API

问题根源 #

你的自定义tsconfig.json虽然继承了Nuxt自动生成的.nuxt/tsconfig.json，但include字段是覆盖而非合并原有配置的。Nuxt 3的自动导入API类型定义存储在.nuxt目录下，而你当前的include仅包含src/**/*，导致WebStorm无法识别这些自动生成的类型文件，从而抛出"Corresponding file is not included in tsconfig.json"错误。

解决步骤 #

• 调整tsconfig.json的include配置，将Nuxt自动生成的目录纳入检查范围：

  {
    "extends": "./.nuxt/tsconfig.json",
    "compilerOptions": {
      "target": "esnext",
      "module": "esnext",
      "noImplicitAny": true,
      "moduleResolution": "node",
      "strict": true,
      "esModuleInterop": true,
      "types": ["@types/node"]
    },
    "include": ["src/**/*", ".nuxt/**/*", "*.vue"],
    "exclude": ["node_modules"]
  }
  

• 让WebStorm重新识别TS配置文件：右键项目根目录下的tsconfig.json，选择Mark as TSConfig，确保IDE使用该文件作为项目的TypeScript配置源。

• 清除WebStorm缓存并重启：依次点击File > Invalidate Caches...，勾选"Clear file system cache and local history"后点击Invalidate and Restart，清除旧的缓存数据。

• 确保Nuxt生成了完整的类型文件：在终端运行npx nuxt prepare或启动开发服务器npm run dev，触发Nuxt重新生成.nuxt目录下的类型定义文件。

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