useEffect 参数不提示、依赖数组没红线,是因为 VS Code 语言模式未设为 JavaScript React 或 TypeScript React,且 tsconfig.json/jsconfig.json 配置缺失或未重启 TypeScript 语言服务,导致类型系统未接管文件。

useEffect 依赖数组提示失效,不是插件没装全,是 TypeScript 语言服务根本没接管这个文件——它在用纯 JS 模式跑,连参数签名都看不到。
为什么 useEffect 参数不提示、依赖数组没红线?
VS Code 默认对 .js 文件启用的是基础 JavaScript 语言服务,它不认识 useEffect 的重载签名,也不校验依赖数组。你敲 useEffect + Ctrl+Space,只弹出函数名,没有参数列表和类型提示。
- 右下角状态栏语言模式必须是
JavaScript React(不是JavaScript)或TypeScript React - 项目根目录必须存在
tsconfig.json(哪怕内容是{}),否则 TS Server 不启动 - TS 项目里
tsconfig.json中"jsx": "react-jsx"缺失或拼错,会导致整个 JSX/Hooks 类型链断裂 - JS 项目需有
jsconfig.json,且含"checkJs": true和"allowJs": true,否则无法推导 Hook 返回值
useEffect 依赖数组漏写为什么不报错?
ESLint 能抓,但前提是规则真正加载并作用于当前文件。常见断点在配置链上:
- 确认已安装
eslint-plugin-react-hooks:npm list eslint-plugin-react-hooks -
.eslintrc.js中plugins包含'react-hooks',rules启用了'react-hooks/exhaustive-deps' - VS Code 设置中
eslint.validate必须包含"javascriptreact"(不只是"javascript") - 如果用 Prettier,
eslint-config-prettier必须放在extends数组末尾,否则会关不掉冲突规则
自定义 Hook(如 useApi)不提示?
VS Code 不会自动扫描项目内函数并“猜”它是 Hook。它只信任两类来源:React 官方包导出的,或有完整类型声明且被 TS Server 扫到的。
- 自定义 Hook 文件必须以
.ts或.tsx结尾(.js文件即使写了 JSDoc 也大概率不生效) - 导出函数需带明确返回类型,例如:
export function useApi<t>() : { data: T | null; loading: boolean }</t> -
tsconfig.json的"include"必须覆盖 Hook 目录,比如"src/hooks/**/*" - 改完配置后,必须手动执行命令:
Developer: Restart Language Server(仅刷新窗口无效)
路径别名(如 @/hooks/useAuth)导入不补全、跳转失败?
这不是插件问题,是 tsconfig.json 的 baseUrl 和 paths 没配对,或者配了但没重启语言服务。
- 确保
tsconfig.json中有:"compilerOptions": { "baseUrl": "src", "paths": { "@/hooks/*": ["hooks/*"] } } -
paths值必须是数组,不能是字符串;"@/*": ["*"]是常用兜底,但别写成["@/*"]或["src/*"] - 改完立刻执行
Developer: Restart Language Server,否则缓存还在用旧映射 - 如果用 Vite,注意其默认不生成
tsconfig.json,必须手建;CRA 项目可能被误删,要检查是否存在
tsconfig.json 后没重启语言服务,结果调了半小时设置,实际还是旧缓存。


















