eslint写jsx报错

eslint写jsx报错

ChatGPT提示

在写JSX时，ESLint可能会报出一些语法错误，这些错误通常是由于ESLint默认配置中不支持JSX语法导致的。为了解决这些错误，我们需要在ESLint配置文件中启用对JSX语法的支持。

首先，需要安装eslint-plugin-react插件：

yarn add eslint-plugin-react --dev
1

然后，在.eslintrc文件中添加以下配置：

{
  "extends": [
    "plugin:prettier/recommended",
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended"
  ],
  "parserOptions": {
    "ecmaVersion": 6,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true,
      "tsx": true
    }
  },
  "parser": "@typescript-eslint/parser",
  "plugins": [
    "@typescript-eslint"
  ],
  "env": {
    "browser": true
  },
  "globals": {
    "document": true
  },
  "ignorePatterns": [
    "src/vendor/*"
  ],
  "rules": {
    "@typescript-eslint/no-explicit-any": "off",
    "@typescript-eslint/no-non-null-assertion": "off"
  }
}



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

在这个配置文件中，我们启用了ESLint对ES6和JSX语法的支持，同时继承了eslint:recommended和plugin:react/recommended配置，启用了react插件，并关闭了react/prop-types规则。如果你需要添加其他的规则或插件，可以在rules和plugins中添加相应的配置。

此外，如果你使用了其他的JSX语法扩展，比如React Router中的 和组件，可以在eslint-plugin-react配置中添加对应的规则，以避免ESLint报出错误。例如：

{
  "rules": {
    "react/jsx-uses-vars": "off",
    "react/jsx-uses-react": "off",
    "react/jsx-no-undef": "off",
    "react/jsx-uses-router": "off"
  }
}
1
2
3
4
5
6
7
8

这些规则可以在ESLint官方文档中找到。

在自己项目加上

我的代码

{
  "extends": [
    "plugin:prettier/recommended",
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended"
  ],
  "parserOptions": {
    "ecmaVersion": 6,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true,
      "tsx": true
    }
  },
  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint"],
  "env": {
    "browser": true
  },
  "globals": {
    "document": true
  },
  "ignorePatterns": ["src/vendor/*"],
  "rules": {
    "@typescript-eslint/no-explicit-any": "off",
    "@typescript-eslint/no-non-null-assertion": "off"
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29