Eslint-plugin-react: React is defined but never used no-unused-vars

Created on 4 Oct 2017  路  6Comments  路  Source: yannickcr/eslint-plugin-react

I have the error 'React' is defined but never used no-unused-vars for *.jsx files with jsx markup. Here is some of my environment:
1) package.json

"react": "^16.0.0"
"babel-eslint": "^8.0.1"                                                                                                                                                                                  
"eslint": "^4.8.0"                                                                                                                                                                                        
"eslint-config-airbnb": "^15.1.0"                                                                                                                                                 "eslint-import-resolver-webpack": "^0.8.3"                                                                                                                                                                
"eslint-loader": "^1.9.0"                                                                                                                                                                                 
"eslint-plugin-import": "^2.7.0"                                                                                                                                                                          
"eslint-plugin-jsx-a11y": "^5.1.1"                                                                                                                                                                        
"eslint-plugin-react": "^7.4.0"                                                                                                                                                     

2) .eslintrc.json

{                                                                                                                          
  "env": {                                                                                                                 
    "browser": true                                                                                                        
  },                                                                                                                       
  "extends": [                                                                                                             
    "airbnb",                                                                                                              
    "plugin:react/recommended"                                                                                             
  ],                                                                                                                       
  "parser": "babel-eslint",                                                                                                
  "plugins": [                                                                                                             
    "import",                                                                                                              
    "react",                                                                                                               
    "jsx-a11y"                                                                                                             
  ],                                                                                                                       
  "rules": {                                                                                                               
    "comma-dangle": ["error", "never"],                                                                                    
    "max-len": ["error", 120],                                                                                             
    "no-unused-vars": ["error", { "args": "none" }],                                                                       
    "react/prop-types": "off"                                                                                              
  },                                                                                                                       
  "settings": {                                                                                                            
    "import/resolver": {                                                                                                   
      "webpack": {                                                                                                         
        "config": "config/webpack/development.js"                                                                          
      }                                                                                                                    
    }                                                                                                                      
  }                                                                                                                        
} 

How can I fix it?

invalid

Most helpful comment

Oh, sorry, my bad 鈽癸笍
I understood what's wrong. As I use React 0.16 I have some draft components like this:

import React from 'react';
const Foo = () => 'Foo';
export default Foo;

The error is quite logical. When I change markup to <div>Foo</div> all works fine

All 6 comments

@ljharb I've just tried adding "react/jsx-uses-vars": "error" and "react/jsx-uses-react": "error" rules but it didn't work

hmm, assuming npm ls exits zero, that should work (and the recommended config should include those rules anyways)

Oh, sorry, my bad 鈽癸笍
I understood what's wrong. As I use React 0.16 I have some draft components like this:

import React from 'react';
const Foo = () => 'Foo';
export default Foo;

The error is quite logical. When I change markup to <div>Foo</div> all works fine

hi
'Router' is defined but never used no-unused-vars
'Route' is defined but never used no-unused-vars
'Link' is defined but never used no-unused-vars
'browserHistory' is defined but never used no-unused-vars
'IndexRoute' is defined but never used no-unused-vars
'About' is defined but never used no-unused-vars
getting errors please help me

Add this to your .eslintrc:

rules: {
    'no-unused-vars': 0,
  },
Was this page helpful?
0 / 5 - 0 ratings