为何仅安装React的项目中VSCode会为useState等钩子提示react-native导入路径

1. 限制tsconfig加载的类型声明范围 #

你当前的tsconfig没有指定types字段，默认会加载node_modules/@types下所有类型包，间接安装的多余类型（比如之前遗留的@types/react-native）会被TypeScript识别，干扰自动补全。在compilerOptions中添加以下配置：

"types": ["react", "react-dom", "node"]

只显式声明你项目需要的类型包，其他未被列入的@types包不会被加载，从根源排除多余类型的干扰。如果有其他需要的类型（比如jest、styled-components）也可以一并加入列表。

2. 配置VSCode自动补全排除规则 #

打开VSCode设置（快捷键Ctrl+, / Cmd+,），添加以下配置，直接屏蔽不需要的包出现在自动补全列表中：

"typescript.preferences.autoImportFileExcludePatterns": [
  "react-native",
  // 其他你不想出现在导入建议里的包可以继续加在这里
  "**/dist/*",
  "**/node_modules/*/node_modules"
]

同时可以开启优先推荐项目根依赖的设置：

"typescript.preferences.importModuleSpecifierPreference": "non-relative",
"typescript.preferences.preferTypeOnlyAutoImports": true

3. 清理缓存并重启服务 #

• 先删除项目下的node_modules文件夹、yarn.lock/package-lock.json/pnpm-lock.yaml锁文件，重新执行依赖安装命令
• 按Ctrl+Shift+P / Cmd+Shift+P调出命令面板，执行TypeScript: Restart TS Server重启TypeScript语言服务
• 若还是有问题，执行Developer: Reload Window重载整个VSCode窗口

4. 校验依赖版本 #

确保项目已安装最新稳定版的@types/react、@types/react-dom依赖，没有出现版本冲突：

# 如果你用yarn
yarn add -D @types/react @types/react-dom
# 如果你用npm
npm i -D @types/react @types/react-dom
# 如果你用pnpm
pnpm add -D @types/react @types/react-dom

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