web-dev-qa-db-fra.com

Bug ESlint avec la classe React, exemple: 'état' n'est pas défini. (no-undef)

je travaille actuellement sur un projet et lorsque j'ai cloné mon projet sur MacBook, après yarn dans Shell pour les packages d'installation et atom . pour ouvrir mon ATOM. ESLint a un "bug".

Par exemple, pour ce code:

/*
 * Package Import
 */
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { Link } from 'react-router-dom';
 import classNames from 'classnames';


/*
 * Code
 */
class UserDropdown extends Component {
  /*
   * PropTypes
   */
   static propTypes = {
     ... // Code 
   }


  /*
   * State
   */
   state = {
     ... // Code
   };

  /*
   * Actions
   */
   onLogOut = () => {
     ... // Code
   };

ESLint me dit:

Error   ESLint  'propTypes' is not defined. (no-undef)  22:10
Error   ESLint  'state' is not defined. (no-undef)  32:3
Error   ESLint  'onLogOut' is not defined. (no-undef)   52:3

J'utilise toujours "babel-plugin-transform-class-properties": "^6.24.1", Et je le déclare dans mon brunch-config:

Mon brunch-config.café

  plugins:
    babel:
      presets: ['latest', 'react']
      plugins: [
        'transform-class-properties'
        'transform-object-rest-spread'
      ]

Mon .eslintrc

{
  "extends": "airbnb",
  "parser": "babel-eslint",
  "env": {
    "browser": true
  },
  "rules": {
    "brace-style": ["error", "stroustrup"],
    "no-param-reassign": ["error", { "props": false }],
    "no-mixed-operators": ["error", { "allowSamePrecedence": true }],
    "jsx-a11y/no-static-element-interactions": "off",
    "react/jsx-filename-extension": "off",
    "react/forbid-prop-types": "off",
    "react/no-unescaped-entities": "off",
    "linebreak-style": "off"
  },
  "settings": {
    "import/resolver": {
      "node": {
        "paths": ["app/"]
      }
    }
  }
}

Et mon packages.json

"devDependencies": {
"auto-reload-brunch": "^2.7.1",
"autoprefixer": "^6.7.7",
"babel-brunch": "^6.1.1",
"babel-eslint": "^7.2.3",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-object-rest-spread": "^6.23.0",
"babel-preset-react": "^6.24.1",
"babel-register": "^6.24.1",
"babel-resolver": "^1.1.0",
"brunch": "^2.10.9",
"chai": "^3.5.0",
"enzyme": "^2.8.2",
"eslint": "^3.19.0",
"eslint-config-airbnb": "^14.1.0",
"eslint-import-resolver-node": "^0.3.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^4.0.0",
"eslint-plugin-react": "^6.10.3",

Je travaille sur deux ordinateurs et sous Linux, ça va. Alors, quelqu'un a une idée? Si vous avez besoin de plus de code pour comprendre, je peux vous l'envoyer. Merci vous mec!

reactjseslinteslint-config-airbnb
6
Alexandre Bourdeaud'hui

J'ai eu le même problème et c'était parce que j'avais ESLint 4 installé. Vérifiez votre package.json et assurez-vous que ce n’est pas quelque chose comme "eslint": "^3.19.0 || ^4.3.0". J'utilise create-react-app et il n'est pas encore compatible avec ESLint 4: https://github.com/facebookincubator/create-react-app/issues/2604

3
jeanfredrik

Vous devez d’abord installer babel-eslint en tant que dépendance de développement, puis dans votre fichier .eslintrc, ajoutez: 

"parser": "babel-eslint"
1
zied hajsalah

mise à niveau eslint

npm i -D eslint@latest
1
qinggangxu

j'ai résolu mon problème en désinstallant node, yarn et npm. J'ai utilisé la dernière version de node (8.2.1 en fait, il en est de même pour npm et yarn ...).

Donc, après l'installation du nœud LTS (6.11.1), et je n'ai aucun problème avec ESLint, fonctionne bien.

Edit: Après avoir réinstallé Yarn (0.27.5), ce problème est de retour ici: penser:

0
Alexandre Bourdeaud'hui