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

Question

J'utilise l'extension airbnb pour lintier mon projet React Project. Maintenant, dans mon index.js J'ai:

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 y a plusieurs façons de résoudre/contourner ce problème. Les deux méthodes principales sont soit de spécifier document comme global, soit de définir 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 à partir de la CLI.

1) En fichier:

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 eslint:

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

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

2. Ajoutez-le en tant que global dans la configuration:

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

3) De la CLI:

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

2. Utilisation de globals: eslint --global document file.js

Ressources:
Spécification de globales avec ESLint
Spécification d'environnements avec ESLint
Spécifier env avec ESLint CLI
Spécification de globales avec ESLint CLI