eslint-plugin-react-hooks仅在终端显示警告？如何在VSCode代码内开启

eslint-plugin-react-hooks 的预期能力同时覆盖两个场景：编辑阶段在VSCode代码区显示黄色下划线警告，以及构建/运行阶段在终端输出日志，不存在仅支持终端输出的设计。你本地仅在日志中看到Hooks相关警告，是VSCode侧ESLint配置未生效导致的，不是插件本身的功能限制。

• 先确认VSCode已安装微软官方的ESLint扩展，eslint-plugin-react-hooks 本身不直接和VSCode交互，所有编辑器内的代码提示都依赖该扩展读取本地ESLint配置后渲染。
• 检查项目根目录的ESLint配置（支持.eslintrc、.eslintrc.js、.eslintrc.json或package.json内的eslintConfig字段几种形式），确认已正确注册插件和对应规则，参考配置如下：

module.exports = {
  // 保留原有其他配置
  plugins: [
    // 保留原有其他插件
    'react-hooks'
  ],
  rules: {
    // 保留原有其他规则
    'react-hooks/rules-of-hooks': 'warn', // 规则等级设为warn即对应黄色下划线提示
    'react-hooks/exhaustive-deps': 'warn' // 依赖项检查规则同理
  }
}

• 检查VSCode的ESLint扩展生效范围：打开VSCode设置，搜索eslint.validate，确保校验范围包含javascript、javascriptreact、typescript、typescriptreact四类文件，否则扩展不会扫描jsx/tsx格式的React组件，自然不会弹出提示。
• 上述配置调整完成后如果仍看不到提示，按Ctrl+Shift+P（macOS系统按Cmd+Shift+P）调出命令面板，执行ESLint: Restart ESLint Server重启ESLint服务，重新打开组件文件即可看到代码区的黄色警告下划线。

常见踩坑提示：如果是用CRA、Vite等脚手架初始化的项目，很多脚手架默认内置了eslint-plugin-react-hooks的终端校验逻辑，但不会自动对接VSCode的ESLint扩展，这也是大部分人遇到“终端有警告、编辑器无提示”的核心原因，按上述步骤对齐配置即可解决。

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