Errore di analisi ESLint: token imprevisto


169

Con questo codice:

import React from 'react';
import { Link } from 'react-router';
import { View, NavBar } from 'amazeui-touch';

import * as Pages from '../components';

const {  Home, ...Components } = Pages;

Ottengo questo errore eslint:

7:16  error  Parsing error: Unexpected token .. Why?

Ecco la mia configurazione eslint:

{
  "extends": "airbnb",
  "rules": {
    /* JSX */
    "react/prop-types": [1, {
      "ignore": ["className", "children", "location", "params", "location*"]
    }],
    "no-param-reassign": [0, {
      "props": false
    }],
    "prefer-rest-params": 1,
    "arrow-body-style": 0,
    "prefer-template": 0,
    "react/prefer-stateless-function": 1,
    "react/jsx-no-bind": [0, {
      "ignoreRefs": false,
      "allowArrowFunctions": false,
      "allowBind": true
    }],
  }
}

.... .... Qual è il problema?


puoi pubblicare la tua configurazione eslint?
azium

grazie ho già caricato ~
DongYao il

3
È necessario utilizzare un parser che supporti la proposta di proprietà di diffusione dell'oggetto.
Felix Kling

"Importa" il token imprevisto? Questo era il mio problema .
Lonnie Best

Risposte:


253

Si verificano errori token imprevisti nell'analisi ESLint a causa dell'incompatibilità tra l'ambiente di sviluppo e le capacità di analisi correnti di ESLint con le modifiche in corso con JavaScripts ES6 ~ 7.

L'aggiunta della proprietà "parserOptions" a .eslintrc non è più sufficiente per situazioni particolari, come l'utilizzo

static contextTypes = { ... } /* react */

nelle classi ES6 in quanto ESLint non è attualmente in grado di analizzarlo da solo. Questa particolare situazione genererà un errore di:

error Parsing error: Unexpected token =

La soluzione è far analizzare ESLint da un parser compatibile. babel-eslint è un pacchetto che mi ha salvato di recente dopo aver letto questa pagina e ho deciso di aggiungerlo come soluzione alternativa per chiunque venga dopo.

basta aggiungere:

"parser": "babel-eslint"

al tuo .eslintrcfile ed esegui npm install babel-eslint --save-devoyarn add -D babel-eslint .

Si noti che poiché la nuova API di contesto a partire da React ^16.3ha alcune importanti modifiche, fare riferimento alla guida ufficiale .


4
yarn add -D babel-eslintper chi usa il filato.
Neurotrasmettitore,

8
Per coloro che non sanno dove aggiungere l' "parser": "babel-eslint"istruzione config, è nel .eslintrc.json. Nel mio caso, è un file JSON, ma fondamentalmente il tuo file .eslintrc
Avid Programmer

2
Nota * Se hai "espulso" la tua app create-reagisci e stai aggiungendo la cancellazione del tuo IDE, babel-eslint è già applicato. Basta aggiungere il parser e il tuo bene.
Wes Duff

1
Ho trovato utile anche questo articolo: grantnorwood.com/…
gurun8

Ho aggiunto il "parser": "babel-eslint"mio al mio file eslintrc ma ho invece ricevuto più errori. Sto lavorando con reagire e mi dice che i miei componenti importati sono stati chiamati ma mai utilizzati. Il che è strano.
David Essien il

61

ESLint 2.x supporta sperimentalmente la sintassi ObjectRestSpread, è possibile abilitarlo aggiungendo quanto segue a .eslintrc: docs

"parserOptions": {
  "ecmaVersion": 6,
  "ecmaFeatures": {
    "experimentalObjectRestSpread": true
  }
},

ESLint 1.x non supporta nativamente l'operatore di diffusione, un modo per aggirare il problema è usare il parser babel-eslint . Le istruzioni di installazione e utilizzo più recenti sono sul file Leggimi del progetto.


2
Non è vero. Il parser predefinito di ESLint Espree supporta la diffusione e persino il resto degli oggetti (questa è l'unica funzione sperimentale supportata da espree). Per ulteriori informazioni, consultare: eslint.org/docs/user-guide/…
Ilya Volodin

1
ecmaFeaturesè stato deprecato. UsaecmaVersion
Richard Ayotte il

7
ecmaVersion: 2018funziona senza preavviso con ESLint 5
Tomasz Racia,

1
La migliore soluzione se posso dirlo.
Ansjovis86,

1
Non vedo alcun problema con questa soluzione - ha funzionato bene per me. È meglio che dover installare anche un nuovo pacchetto!
Steam gamer

49

"parser": "babel-eslint" mi ha aiutato a risolvere il problema

{
    "parser": "babel-eslint",
    "parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true,
            "modules": true,
            "experimentalObjectRestSpread": true
        }
    },
    "plugins": [
        "react"
    ],
    "extends": ["eslint:recommended", "plugin:react/recommended"],
    "rules": {
        "comma-dangle": 0,
        "react/jsx-uses-vars": 1,
        "react/display-name": 1,
        "no-unused-vars": "warn",
        "no-console": 1,
        "no-unexpected-multiline": "warn"
    },
    "settings": {
        "react": {
            "pragma": "React",
            "version": "15.6.1"
        }
    }
}

Riferimento


3
Questa risposta non aggiunge nulla alla risposta di @ JaysQubeXon.
cs01,

7
In realtà lo fa - ottieni un esempio di configurazione (con parserOptions inclusa)
kriskodzi

Fantastico avere l'esempio completo ++. Mi ha aiutato a correggere un errore di suggerimenti di TamperMonkey JS.
brasofilo,

@brasofilo dove cambi eslint in tamper monkey?
Metin Dagcilar,

22

Ho risolto questo problema con First, installando babel-eslint usando npm

npm install babel-eslint --save-dev

In secondo luogo, aggiungere questa configurazione nel file .eslintrc

{
   "parser":"babel-eslint"
}

Grazie, questo ha risolto i miei problemi di lanugine
lanugine

21

Nel mio caso (sto usando Firebase Cloud Functions) ho aperto .eslintrc.jsone modificato:

"parserOptions": {
  // Required for certain syntax usages
  "ecmaVersion": 2017
},

per:

"parserOptions": {
  // Required for certain syntax usages
  "ecmaVersion": 2018
},

9

Inizialmente, la soluzione consisteva nel fornire la seguente configurazione in quanto la distruzione degli oggetti era una funzionalità sperimentale e non supportata per impostazione predefinita:

{
  "parserOptions": {
    "ecmaFeatures": {
      "experimentalObjectRestSpread": true
    }
  }
}

Dalla versione 5, questa opzione è stata deprecata .

Ora è sufficiente dichiarare una versione di ES, che è abbastanza nuova:

{
  "parserOptions": {
    "ecmaVersion": 2018
  }
}

1

Se hai un'attività pre-commit con husky in esecuzione eslint, continua a leggere. Ho provato la maggior parte delle risposte su parserOptionseparser valori in cui il mio vero problema riguardava la versione del nodo che stavo usando.

La mia versione attuale del nodo era 12.0.0, ma husky stava usando la mia versione predefinita nvm in qualche modo (anche se non avevo nvmnel mio sistema). Questo sembra essere un problema con lo stesso husky . Così:

  1. Ho cancellato la $HOME/.nvmcartella che non è stata cancellata quando l'ho rimossanvm precedenza.
  2. Il nodo verificato è l'ultimo e ha eseguito le opzioni di analisi corrette.
  3. Ha iniziato a funzionare!

1

Per la cronaca, se stai usando eslint-plugin-vue , il posto giusto da aggiungere 'parser': 'babel-eslint'è all'interno di parserOptionsparam.

  'parserOptions': {
    'parser': 'babel-eslint',
    'ecmaVersion': 2018,
    'sourceType': 'module'
  }

https://eslint.vuejs.org/user-guide/#faq

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.