ESlint 在 VS Code 中不起作用的原因是什么

Question

ESlint 不会挂钩代码，并且在保存时不会给出错误，但是如果运行 npm run lint 命令，则会显示错误，我将附上带有设置的屏幕截图

    "@typescript-eslint/eslint-plugin": "^5.12.1",
    "@typescript-eslint/parser": "^5.12.1",
    "eslint": "^8.10.0",
    "eslint-config-airbnb": "^19.0.4",
    "eslint-plugin-import": "^2.25.4",
    "eslint-plugin-jsx-a11y": "^6.5.1",
    "eslint-plugin-react": "^7.29.2",
    "eslint-plugin-react-hooks": "^4.3.0",

Answer 1

您可以检查以下步骤：

1. 在 vscode 上安装 eslint 扩展
2. 在 vscode 设置、格式化部分中，取消选中保存时格式化
3. 将设置添加到 .vscode 文件夹

根据您使用的功能/预设，您可以将相关选项添加到 .vscode/settings.json

{
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": [
    "source.fixAll.eslint"
  ],
  "eslint.validate": ["javascript", "javascriptreact", "typescript", "vue"]
}

4. 关闭并重新打开 vscode

Answer 2

对我来说，这个问题有点独特。我安装了 ESlint，就像致敬所示的那样

npm init @eslint/config

但它对我不起作用。

我安装并更新了 Eslint VScode 扩展，但没有任何效果。当我在命令行中运行

npx eslint .

时，我收到了此错误

ESLint couldn't find a configuration file

但我有一个配置文件，这让我很困惑，因为我已经有了一个配置文件。

事实证明，我的问题是没有意识到 ESlint 9 发布带来的重大变化。

解决方案

经过几个小时的实验。这是我让它工作的方法：

首先，我确保我使用的是最新版本的 Node.js：

node -v
v22.0.0

然后我安装了没有

@

的 Eslint:

npm init eslint/config

以下是我收到的提示问题：

✔ How would you like to use ESLint? · problems
✔ What type of modules does your project use? · esm
✔ Which framework does your project use? · none
✔ Does your project use TypeScript? · javascript
✔ Where does your code run? · browser
The config that you've selected requires the following dependencies:

globals, @eslint/js, eslint
✔ Would you like to install them now? · No / Yes
✔ Which package manager do you want to use? · npm
☕️Installing...

added 94 packages, and audited 159 packages in 12s

随后，创建了包含以下内容的

eslint.config.js

文件：

import globals from "globals";
import pluginJs from "@eslint/js";


export default [
  {languageOptions: { globals: globals.browser }},
  pluginJs.configs.recommended,
];

我以前从未见过这种类型的配置文件。起初我还以为是哪里出了问题，后来发现是新的配置文件的问题。其他配置如

.eslintrc

已被弃用。

经过研究，我了解到我可以在配置中添加规则，如下所示：

import globals from "globals";
import pluginJs from "@eslint/js";

export default [
  { languageOptions: { globals: globals.browser } },
  pluginJs.configs.recommended,
  {
    rules: {
      semi: "error",
      "prefer-const": "error",
    },
  },
];

之后，VScode 和 ESlint 开始工作，我可以看到错误。