Error 'document' not defined: eslint / React

Question

I am creating a React application with create-react-app.

When I started eslint, I got the following error: 8: 3 "document" error not defined no-undef.

Here is the following .jsx file and my eslint configuration. My application works without errors, but I got this eslint error in 2 files.

index.jsx:

import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import './index.css'; ReactDOM.render( <App />, document.getElementById('root'), ); 

eslintrc.js:

 module.exports = { "extends": "airbnb", "plugins": [ "react", "jsx-a11y", "import" ], "env": { "jest": true } }; 

How can i fix this? For now, I will simply ignore both files ... but I would rather find a long-term solution.

Answer 1

Add "browser": true your env to enable global variables (e.g. document, window, etc.)

See the ESLint documentation for more information.

Answer 2

In package.json specify the test environment for jest as "jsdom" as follows:

  "jest": { "testEnvironment": "jsdom" } 

I ran into the same problem and it worked for me.