缺少依赖项警告 React 未显示

Question

我遇到一个问题，即 React 中的

useEffect

不再显示缺少依赖项警告。如果这很重要的话，我正在使用 VS Code。

有谁知道这可能是什么原因，因为现在我什至不知道从哪里开始调试。

Answer 1

请安装Error Lens和Microsoft ESLint。这对我有用。

我希望这也适合你。

Answer 2

在 VS Code 中，按

Ctrl + Shift + P

打开命令提示符，然后运行 ESLint: Show Output Channel。如果 ESLint 缺少某些 React 插件，它会告诉你。

也可能是 VS Code 的 TS 服务器有问题。除其他事项外，它还检查依赖关系。打开终端 (

Ctrl + '

)，选择“输出”选项卡，然后从右侧的下拉菜单中选择“Typescript”。

如果您使用的是 Yarn v3，则需要安装 eslint 和 typescript 作为开发依赖项，然后运行

yarn dlx @yarnpkg/sdks vscode

并将 VS Code 切换到 Typescript 的工作区版本（提示将显示在弹出窗口中）。

Answer 3

您的问题与 eslint 有关。

检查你的代码，看看是否有这样的代码行？

 // eslint-disable-next-line

或者这个：

// eslint-disable-next-line react-hooks/exhaustive-deps

如果是，请删除它。

另一个原因可能是 .eslintignore 文件。 检查您的项目中是否存在这个 .eslintignore 文件，删除它应该可以解决您的问题

Answer 4

就我而言，我使用的是 React Extension Pack，其中一些包含的扩展已安装在我的 Vs Code 中。然后我卸载了所有包含的扩展，之后再次安装 React Extension Pack，并自动删除了所有问题。

Answer 5

您可能已禁用

react-hooks/exhaustive-deps

eslint 规则或扩展了禁用它的 eslint 规则集。确保使用的任何 eslint 配置中都不存在以下行：

'react-hooks/exhaustive-deps': 'off'

Answer 6

如果您的

.eslintrc

 配置规则之一配置错误，

VSCode eslint 将无法按预期工作。

例如：

{
  ...
  "rules": {
    "react/react-in-jsx-scope": false, // <---- this will turn off the warning
    "react-hooks/rules-of-hooks": "error",
    "react-hooks/exhaustive-deps": "warn"
  },
  ...
}

如果您将 'false' 更改为 'off' 那么错误将会显示

{
  ...
  "rules": {
    "react/react-in-jsx-scope": "off", // <---- replace false into off
    "react-hooks/rules-of-hooks": "error",
    "react-hooks/exhaustive-deps": "warn"
  },
  ...
}

Answer 7

我通过更新 VS Code 解决了这个问题。 ESLint 与我的旧 VS Code 版本不兼容。

Answer 8

通过将 VS Code 更新到最新版本修复了该问题