"fetch" is undefined and "localStorage" is undefined , on using eslint-config-airbnb in react.js

Question

I want to modify my code structure using eslint of airbnb. I have follwed these instruction given in eslint-config-airbnb. After initiating the command npm run lint, results consists of 'fetch' is not defined and also, 'localStorage' is not defined.

I have gone through this github issue, but still error is shown as the same 'fetch is not defined'. Is there any solutions for it.

Kannan

please edit your question and show us your eslint config file – Ultramontane

Answer 1

You can configure your .eslintrc file with globals.

Add this to your .eslintrc file.

"globals": {
        "localStorage": true,
        "fetch": true
    }

Lands

gr8, happy linting! if you get annoyed or you have lots of global variable in use. then just put. "no-undef": 0 inside rules tag of .eslintrc file. – Lands

Answer 2

No need to add it as an exception, just add this to your .eslintrc and eslint will know what it is:

  "env": {
    "browser": true
  }

Breslau

I had this already set but localStorage was still not recognized. – Tiphani

It works! You're right, no need to add it as an exception 👍 – Fireeater

adding browser: true will result in other errors such as not being able to recognize Node.js specifics i.e. process.env – Rapacious

the accepted answer seems to be more targetted at the issue. setting browser: true will cause many other linting errors to disappear such as unused variables. – Kith

Answer 3

you can try to access to the fetch and localStorage through window object.

window.fetch, window.localStorage

Dimpledimwit

This works as a solution when trying to abide by lint rules w/o needing to modify the config. This is the case if you use a tool like StandardJS: standardjs.com – Braley

'localStorage' is not defined. (no-undef) standard(no-undef) That is exactly what I was trying to remedy. Thank you! – Bove