VSCode中TypeScript声明文件仅打开时生效的智能感知问题

排查与修复步骤 #

1. 配置tsconfig.json确保声明文件被识别 #

如果项目没有tsconfig.json，在根目录新建一个；如果已有，检查include字段是否覆盖了src下所有文件：

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

• src/**/*会匹配src目录下所有子文件和子目录，确保declarations.d.ts被TypeScript编译器纳入处理范围。

2. 确认声明文件语法正确 #

检查src/declarations.d.ts的内容是否符合TypeScript声明规范，针对图片文件的声明示例：

declare module "*.png" {
  const url: string;
  export default url;
}

// 如需支持其他格式，添加对应声明
declare module "*.jpg" {
  const url: string;
  export default url;
}

• 确保文件扩展名是.d.ts，且位于src目录下。

3. 刷新TypeScript服务器缓存 #

在VSCode中按下Ctrl+Shift+P，执行以下两个命令：

• TypeScript: Restart TS Server
• TypeScript: Reload Project

4. 检查Parcel配置（可选） #

如果项目有自定义.parcelrc或package.json中的Parcel配置，确保没有干扰TypeScript类型检测的设置。若无特殊需求，保持Parcel默认配置即可。

验证方法 #

保存所有修改后，关闭declarations.d.ts文件，打开main.ts查看导入图片的语句是否还出现ts(2307)错误。

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