为什么 ESLint 看不到一个 JS 文件的所有引号问题？

Question

问题： ESLint 在我使用 React 的 JS 文件中没有看到所有引号问题。

预期：看到 ESLint 检查我的错误并显示给我。

我尝试过的事情： 我更改了一些引号以查看差异，我发现对于导入 ESLint 是有效的，但在组件中它没有。我检查了我的规则，发现有 'quotes' 规则。我检查了我的错误是准确的，只是为了引用，我发现没有任何问题。

我将附上一张有问题的图片：

如你所见，第一行一切正常，因为我加了双引号。然后在第二行和第三行中有简单的引号，ESLint 可以看到它们。可以看出ESLint只能看到引号问题，仅此而已。

然后，问题就来了。在 'flex-container' 处，它看不到必须有双引号，并且无法解决这个问题。这不仅仅是一个例外，因为在最后一行也是单引号，它看不到。

我的 .eslintrc.json 文件：

{
    "env": {
        "browser": true,
        "es2021": true,
        "node": true,
        "amd": true,
        "jquery": true
    },
    "extends": [
        "eslint:recommended",
        "plugin:react/recommended"
    ],
    "parserOptions": {
        "ecmaVersion": 12,
        "sourceType": "module"
    },
    "rules": {
        "react/prop-types": "off",
        "react/jsx-uses-react": "warn",
        "react/react-in-jsx-scope": "off",
        "quotes": [
            "error",
            "double",
            {
                "avoidEscape": true
            }
        ]
    },
    "globals": {
        "React": true,
        "ReactDOM": true,
        "ReactRedux": true,
        "ReactRouterDOM": true,
        "Redux": true
    },
    "settings": {
        "react": {
            "version": "detect"
        }
    }
}

我更改了规则的一些属性，用 'error' 代替 'off' 或 'warn'，但它是一样的。

我能做什么？

Answer 1

所以，ESLint 作者的回答是：

“quotes 规则在这种情况下按预期工作，因为它只检查字符串文字。

对于 JSX 属性，您可以使用 jsx-quotes rule, as in this demo。"

为什么 ESLint 看不到一个 JS 文件的所有引号问题？

Why ESLint doesn't see all the quotes problems of a JS file?

javascript

reactjs

eslint

visual-studio-code