'React' is defined but never used no-unused-vars

See original GitHub issue

When i run eslint on my code, I get the error: 'React' is defined but never used no-unused-vars when I remove import ‘React’ from ‘react’ I get the error 'React' must be in scope when using JSX

I tried enabling the rules below but still receive the error. “react/jsx-uses-react”: 1, “react/jsx-uses-vars”: 1, “react/react-in-jsx-scope”: 1

Can someone help me check if my configurations are correct, if I’m not overriding anything?

{
  "parser": "babel-eslint",
  "extends": [
    "eslint:recommended",
    "airbnb",
    "plugin:flowtype/recommended"
  ],
  "plugins": [
    "babel",
    "react",
    "flowtype"
  ],
  "rules": {
    "react/jsx-uses-react": 1,
    "react/jsx-uses-vars": 1,
    "react/react-in-jsx-scope": 1,
  
    // Indent with 4 spaces
    "indent": [
      "error",
      4
    ],
    // Indent JSX with 4 spaces
    "react/jsx-indent": [
      "error",
      4
    ],
    // Indent props with 4 spaces
    "react/jsx-indent-props": [
      "error",
      4
    ],
    // TODO: Remove all of these exceptions
    // We have code that violates each one of these rules.
    // We should fix the style then remove the rules when we can.
    "consistent-return": "off",
    "flowtype/no-types-missing-file-annotation": "off",
    "import/extensions": "off",
    "import/no-unresolved": "off",
    "import/no-named-as-default": "off",
    "import/no-named-as-default-member": "off",
    "import/prefer-default-export": "off",
    "react/default-props-match-prop-types": "off",
    "react/forbid-prop-types": "off",
    "react/jsx-closing-tag-location": "off",
    "react/jsx-filename-extension": "off",
    "react/no-string-refs": "off",
    "react/no-unused-prop-types": "off",
    "react/no-unused-state": "off",
    "react/prefer-stateless-function": "off",
    "react/prop-types": "off",
    "react/require-default-props": "off",
    "react/sort-comp": "off",
    "max-len": "off",
    "no-case-declarations": "off",
    "no-console": "off",
    "no-mixed-operators": "off",
    "no-nested-ternary": "off",
    "no-shadow": "off",
    "no-use-before-define": "off",
    "no-underscore-dangle": "off",
    "no-unused-expressions": "off",
    "prefer-promise-reject-errors": "off"
  },
  "env": {
    "jest": true
  },
  "globals": {
    "fetch": false,
    "Response": false,
    "React": true
  }
}

I am using these versions in package.json: devDependencies

      "eslint-config-airbnb": "16.1.0",
      "eslint-plugin-babel": "^5.1.0",
      "eslint-plugin-flowtype": "^2.46.1",
      "eslint-plugin-react": "^7.9.1",

dependencies

  "react": "16.0.0",
  "react-native": "0.50.4",

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:2
  • Comments:12 (6 by maintainers)

github_iconTop GitHub Comments

3reactions
ljharbcommented, Jul 3, 2019

indeed; when that comment is present, you don’t need the React import and can/should delete it.

3reactions
totstepscommented, Jul 2, 2019

Seems like /** @jsx jsx */ is causing the error. Error no longer appears after removing it.

I think this can be closed unless @VanessaChu haven’t resolved the issue.

Read more comments on GitHub >

github_iconTop Results From Across the Web

ESLint with React gives `no-unused-vars` errors
I have my eslintrc extending plugin:react/recommended , but it still gives me this warning. I think it's because I'm using React in a...
Read more >
'React' is defined but never used no-unused-vars · Issue #11183
When i run eslint on my code, I get the error: 'React' is defined but never used no-unused-vars when I remove import 'React'...
Read more >
no-unused-vars - ESLint - Pluggable JavaScript Linter
A pluggable and configurable linter tool for identifying and reporting on patterns in JavaScript. Maintain your code quality with ease.
Read more >
UseState is defined but never used no-unused-vars : r/reactjs
This is a linting error. Importing stuff requires work. If you import something but never use it, resources go to waste for nothing...
Read more >
'index' is defined but never used. (no-unused-vars)-Reactjs
Coding example for the question 'Error' message: ''index' is defined but never used. (no-unused-vars)-Reactjs.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found