我正在使用 create-react-app typescript eslint 应用程序,在构建过程中出现以下错误:
Line 1:8: 'React' was used before it was defined @typescript-eslint/no-use-before-define
我的组件中的代码开头为:
import React from "react";
埃斯林特设置:
module.exports = {
parser: "@typescript-eslint/parser",
parserOptions: {
ecmaVersion: 2020,
sourceType: "module",
ecmaFeatures: {
jsx: true
}
},
settings: {
react: {
version: "detect"
}
},
extends: [
"plugin:react/recommended",
"plugin:@typescript-eslint/recommended",
"prettier/@typescript-eslint",
"plugin:prettier/recommended"
],
rules: {
"@typescript-eslint/explicit-module-boundary-types": 0,
"@typescript-eslint/triple-slash-reference": 0,
"no-use-before-define": "off",
"@typescript-eslint/no-use-before-define": "off"
},
};
package.json 的某些部分:
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^4.1.0",
"@typescript-eslint/parser": "^4.1.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.6.0",
"eslint-config-airbnb": "^18.1.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-import": "^2.20.2",
"eslint-plugin-prettier": "^3.1.3",
"eslint-plugin-react": "^7.20.0",
"prettier": "^2.0.5",
"start-server-and-test": "^1.11.3"
},
"dependencies": {
...
"react-scripts": "3.4.3",
...
}
I tried:
- 读https://github.com/typescript-eslint/typescript-eslint/issues/2502
- 在 .eslintrc.js 中禁用 @typescript-eslint/no-use-before-define 和 no-use-before-define
- 实际上我尝试删除 .eslintrc.js ,但遇到了同样的错误。
答案
该错误是由于不匹配而发生的@typescript-eslint
反应脚本和本地版本package.json
-GitHub问题
您可以降级软件包,直到react-scripts
更新他们的版本。
"@typescript-eslint/eslint-plugin": "4.0.1",
"@typescript-eslint/parser": "4.0.1",
EDIT 2020-09-14
该错误似乎与以下内容无关react-scripts
的版本@typescript-eslint
因为多人报告了相同的错误而没有使用react-scripts
。
无论如何,解决方法保持不变 - 降级到工作版本@typescript-eslint
直到修复可用。
EDIT 2020-10-24
[email protected]
已发布并更新@typescript-eslint
。
EDIT 2020-11-04
如果升级软件包后错误仍然存在,很可能您的 eslint 配置使用了错误的规则。伊戈尔的回答要解决这个问题。