Résolution de l'erreur linter no-undef pour le document

Question

J'utilise airbnb pour linting mon projet React. Maintenant, dans mon index.js Je l'ai fait :

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(
  <App />,
  document.getElementById('root'),
);

linter dit :

no-undef 'document' is not defined.at line 8 col 3

Comment puis-je résoudre ce problème ?

Answer 1

Il existe un certain nombre de moyens de résoudre ou de contourner ce problème. Les deux principaux moyens sont de spécifier document comme global ou pour régler le eslint-env comme browser (ce que vous voulez probablement). Vous pouvez le faire 1) dans le fichier, 2) dans la configuration, ou même 3) lors de l'exécution depuis l'interface CLI.

1) Dans le dossier :

1. Définissez l'environnement comme browser dans votre fichier :

   /* eslint-env browser */
   import React from 'react';
   import ReactDOM from 'react-dom';
   import App from './App';
   
   ReactDOM.render(
     <App />,
     document.getElementById('root'),
   );

2. Ajoutez-le en tant que global dans le fichier lui-même :

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

2) Dans la configuration de eslint :

1. Définissez l'environnement comme browser dans la configuration :

   {
     "env": {
       "browser": true,
       "node": true
     }
   }

2. Ajoutez-le comme global dans la configuration :

   {
     "globals": {
       "document": false
     }
   }

3) À partir de l'interface CLI :

1. Utiliser env : eslint --env browser,node file.js

2. Utilisation des globaux : eslint --global document file.js

Ressources :
Spécifier les globaux avec ESLint
Spécification des environnements avec ESLint
Spécifier env avec ESLint CLI
Spécifier les globaux avec ESLint CLI