React.js与ESlint设置

Question

当我使用ESLint检查我的代码时，我收到了这个错误---'React'被定义但从未使用过no-unused-vars

import React from 'react';
const app=({})=>{
    return <div>123</div>;
};
export default app;

如何修改.eslintrc.json文件以修复此错误？

Answer 1

使用eslint-plugin-react eslint插件，它为eslint引入了React特定的linting规则。

只需使用npm安装它并在eslint配置文件中配置它。

npm install eslint-plugin-react --save-dev

{
  "plugins": [
    "react"
  ]
}

然后您需要在eslint配置文件中启用react/jsx-uses-react规则。

"rules": {
   // other rules,
   "react/jsx-uses-react": 2
}

或者您可以使用extends属性启用所有推荐的eslint-plugin-react配置。

{
  "extends": [... /*other presets*/, "plugin:react/recommended"]
}

但是，这也会启用一些additional rules来强制执行React良好实践。