防止 ESLint "no-undef" 在 ReactJS 箭头函数类属性上



我正试图让@babel/plugin-proposal-class-properties@babel/eslint-parser和ESLint一起工作。我有很多这样写的类方法:

class MyClass extends PureComponent {
...
someProperty = () => { ... } // < ESLint: 'someProperty' is not defined.(no-undef)
...
}

它们确实能工作,代码也能运行。除了, ESLint仍然认为它们是错误的。

我知道这个问题已经被问过好几次了(比如这里),但是我已经被困了好几天了,似乎没有一个答案对我有帮助。

我的.eslintrc文件:

{
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"airbnb"
],
"parser": "@babel/eslint-parser", // < I do use the babel parser
"parserOptions":{
"ecmaFeatures": {
"experimentalObjectRestSpread": true
},
"babelOptions": {
"plugins": [
"@babel/plugin-proposal-class-properties" // < tried putting my plugin here
]
}
},
"plugins": [
"react",
"jsx-a11y",
"import",
// "@babel" < "ESLint: Error: Failed to load plugin @babel: Cannot find module 'eslint-plugin-@babel'"
],
"rules": {
"react/jsx-filename-extension": 0,
"no-plusplus": 0,
"comma-dangle": [2, "never"],
"indent": ["error", 2, { "SwitchCase": 1 }],
"react/jsx-indent": ["error", 2],
"react/jsx-indent-props": ["error", 2],
"max-len": [2, 300],
"semi": [2, "never"],
"no-underscore-dangle": 0,
"no-script-url": 0,
"no-extend-native": ["error", { "exceptions": ["String"] }],
"no-restricted-syntax": ["error", "ForOfStatement", "LabeledStatement", "WithStatement"],
"import/no-unresolved": [2, { "ignore" : [ "electron" ] }]
}
}

我的babel.config.json文件:

{
"presets": [["@babel/preset-env", { "modules": false }], "@babel/preset-react"],
"plugins": [
"babel-plugin-add-module-exports",
"babel-plugin-async-to-promises",
"babel-plugin-syntax-async-functions",
"@babel/plugin-proposal-function-bind",
"@babel/plugin-transform-modules-commonjs",
"@babel/plugin-proposal-class-properties"
],
"env": {
"production": {
"presets": ["react-optimize"],
"plugins": [
"babel-plugin-transform-remove-console",
"babel-plugin-transform-remove-debugger",
"babel-plugin-dev-expression"
]
},
"dev": {
"presets": []
},
"test": {
"plugins": [
["webpack-loaders", { "config": "webpack.config.node.js", "verbose": false }]
]
}
}
}

包版本:

@babel/core: 7.12.10
@babel/eslint-parser: 7.12.1
@babel/eslint-plugin: 7.12.1
@babel/plugin-proposal-class-properties: 7.12.1
eslint: ^3.19.0

如果有人遇到这个问题,我最终将eslint更新到最新版本(当时为7.18.0),我的问题就解决了。

最新更新