प्रतिक्रिया के साथ ESLint 'नो-अप्रयुक्त-वर्र्स' त्रुटियां

Question

मैंने eslint & eslint-plugin-react सेट किया है।

जब मैं ईएसलिंट चलाता हूं, तो लिटर प्रत्येक प्रतिक्रिया घटक के लिए no-unused-vars त्रुटियों को लौटाता है।

मुझे लगता है कि यह स्वीकार नहीं कर रहा है कि मैं जेएसएक्स या प्रतिक्रिया वाक्यविन्यास का उपयोग कर रहा हूं। कोई विचार?

उदाहरण:

app.js

import React, { Component } from 'react'; 
import Header from './header.js'; 

export default class App extends Component { 
    render() { 
    return (
     <div> 
     <Header /> 
     {this.props.children} 
     </div> 
    ); 
    } 
} 

Linter त्रुटियाँ:

0:

/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" ] } } 

Answer 1

अपने .eslintrc.json में, extends के तहत, निम्न प्लग इन में शामिल हैं:

'extends': [ 
    'plugin:react/recommended' 
] 

Source

Answer 2

जब से मैं इस पाया, जबकि googling, आपको पता होना चाहिए कि यह सरल नियम इस संदेश को रोकने के लिए पर्याप्त है:

react/jsx-uses-react 

react/recommended नियमों का सेट 012 जोड़ता हैआप नहीं चाहते हैं।

Answer 3

react/recommended से नए नियमों को जोड़ने स्थापित बिना यह केवल समस्या को हल करने eslint-प्लगइन-प्रतिक्रिया

NPM मैं eslint-प्लगइन-प्रतिक्रिया --save

.eslintrc.js में जोड़ें:

"प्लग इन": [ "प्रतिक्रिया"]

और

"नियम": { "प्रतिक्रिया/jsx-उपयोग करता है प्रतिक्रिया": "त्रुटि", "प्रतिक्रिया/jsx-उपयोग करता है-वार्स": "त्रुटि"}