React Native TypeScript项目中VSCode未打开文件不显示错误的解决方法

一、调整VSCode核心设置 #

打开VSCode设置（快捷键Ctrl+,或Cmd+,），搜索并修改以下选项，也可以直接在settings.json中添加配置：

{
  // 让TS服务动态监控项目文件，无需打开即可检测错误
  "typescript.tsserver.watchOptions.useDynamicWatch": true,
  // 启用项目级诊断，自动扫描所有文件的错误
  "typescript.tsserver.experimental.enableProjectDiagnostics": true
}

同时检查files.exclude配置，确保没有误排除你的业务代码目录（比如src/、app/），避免VSCode跳过这些文件的扫描。

二、优化tsconfig.json配置 #

当前配置继承了@tsconfig/react-native，需要补充明确的文件扫描范围，确保TS服务知道要检查哪些文件：

{
  "extends": "@tsconfig/react-native/tsconfig.json",
  "include": [
    "src/**/*",
    "app/**/*", // 如果使用Expo的app目录结构
    "*.ts",
    "*.tsx"
  ]
}

注意：不要关闭isolatedModules选项，React Native依赖这个选项配合Babel完成模块转译，只需通过include明确扫描范围即可。

三、重启TypeScript服务 #

配置修改后，需要重启TS服务让设置生效：

• 打开命令面板（Ctrl+Shift+P或Cmd+Shift+P）
• 输入TypeScript: Restart TS Server并执行

完成以上操作后，VSCode会自动扫描所有指定范围内的文件，错误会实时显示在「Problems」面板，侧边栏对应文件也会出现红色下划线提示。

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