Skip to content

Instantly share code, notes, and snippets.

@sahilrajput03
Last active December 31, 2021 07:15
Show Gist options
  • Save sahilrajput03/bdd1f1d686da2e919eac647c89d87310 to your computer and use it in GitHub Desktop.
Save sahilrajput03/bdd1f1d686da2e919eac647c89d87310 to your computer and use it in GitHub Desktop.
eslint-hooks-rules #eslint-hooks-rules #eslint-disabling-in-react-project

Disable eslint warnings in react server (and in brower too) via below settings in package.json file.

  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ],
    "rules": {
      "no-unused-vars": 0,
      " ↑↑↑ OR ↓↓↓↓ #You either need the above one, or the below one. Use below one if you are using typesript template.": "",
      "@typescript-eslint/no-unused-vars": 0 
    }
  },

Related info

  • 0 signifies no error, 1 signifies warning, 2 signifies error.

  • Note: You don't need to set EXTEND_ESLINT=true in env file at all.

  • Note: You don't need to restart the react server in order to change eslint extend settings, you can simply edit them live, and resave any .js file and see the warnings/errors/no-errors update lively. Yikes!

  • Tested with •create-reat-app v4.0.0 and •create-reat-app v4.0.0 with typescript template.

  • For older cra's these settings might not work, and you might need to use the second point's settings, and it might be actually broke coz of no support from eslint package as it broke the functionality for react-scripts earlier.

  • Also you can simply use this in your .js files too -> /* eslint-disable no-unused-vars */.

But don't use /* eslint-disable */ coz that'll disable the hooks rules warnings too, and that are very important for any programmer.


*Important, CRA V4. { Both for vanilla js and typescipr template} ALREADY HAVE THIS INBUILT. (So, in cra you don't need to install it explicitly.)

yarn add eslint-plugin-react-hooks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment