eslint＆を設定しましたeslint-plugin-react。
ESLint を実行すると、リンターはno-unused-vars各 React コンポーネントに対してエラーを返します。
JSX または React 構文を使用していることを認識していないのではないかと思います。何かアイデアはありますか?
例：
アプリ
import React, { Component } from 'react';
import Header from './header.js';
export default class App extends Component {
render() {
return (
<div>
<Header />
{this.props.children}
</div>
);
}
}
リンターエラー:
/my_project/src/components/app.js
1:8 error 'React' is defined but never used no-unused-vars
2:8 error 'Header' is defined but never used no-unused-vars
これが私の.eslintrc.jsonファイルです:
{
"env": {
"browser": true,
"es6": true
},
"extends": "eslint:recommended",
"parserOptions": {
"ecmaFeatures": {
"experimentalObjectRestSpread": true,
"jsx": true
},
"sourceType": "module"
},
"plugins": [
"react"
],
"rules": {
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
"indent": [
"error",
2
],
"linebreak-style": [
"error",
"unix"
],
"quotes": [
"error",
"single"
],
"semi": [
"error",
"always"
]
}
}
ベストアンサー1
まず、次のモジュールをインストールしますnpm install --save-dev eslint-plugin-react。
次に、 の.eslintrc.jsonの下にextends次のプラグインを追加します。
'extends': [
'plugin:react/recommended'
]