如何在VSCode中便捷查看ESLint错误与警告？

• 检查ESLint扩展状态
  打开VSCode扩展面板（快捷键Ctrl+Shift+X），找到ESLint扩展，确认它处于启用状态，未启用的话点击启用按钮。

• 确认项目依赖与配置
  项目根目录必须安装eslint依赖，没装的话在终端执行：

  npm install eslint --save-dev
  

  同时确保存在ESLint配置文件，比如.eslintrc.js、.eslintrc.json，或在package.json中配置eslintConfig字段。没有配置文件的话，可运行npx eslint --init生成。

• 调整VSCode的ESLint设置
  打开设置面板（快捷键Ctrl+,），搜索ESLint，重点核对以下配置：

  • ESLint: Enable：勾选开启扩展检测功能
  • ESLint: Run：设为onType或onSave，实现编辑/保存时自动检测
  • ESLint: Validate：确认包含你使用的文件类型，比如JavaScript、TypeScript，若缺失可手动添加：

    "eslint.validate": [
      "javascript",
      "javascriptreact",
      "typescript",
      "typescriptreact"
    ]
    

• 重启ESLint服务
  打开命令面板（快捷键Ctrl+Shift+P），输入ESLint: Restart ESLint Server并执行，重启扩展服务。

• 排查排除规则冲突
  检查files.exclude和eslint.exclude设置，确保你的项目文件没被排除在检测范围外。

• 禁用冲突扩展
  暂时关闭其他代码检测类扩展（如Prettier、Stylelint），排查是否因扩展冲突导致ESLint失效，确认后再逐一启用。

• 查看日志定位问题
  打开输出面板（快捷键Ctrl+Shift+U），在下拉菜单选ESLint，查看日志里的错误提示（比如配置错误、依赖缺失），根据提示解决问题。

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