Come configurare ESLint per consentire i metodi di classe freccia grossa

ESLint genera un errore Parsing error: Unexpected token = quando provo a filtrare le mie classi Es6. Quale parametro di configurazione sono mancante per abilitare i metodi della classe freccia grossa in eslint?Come configurare ESLint per consentire i metodi di classe freccia grossa

classe

Esempio:

class App extends React.Component{ 
    ... 
    handleClick = (evt) => { 
     ... 
    } 
}

.eslint

{ 
    "ecmaFeatures": { 
    "jsx": true, 
    "modules":true, 
    "arrowFunctions":true, 
    "classes":true, 
    "spread":true, 

    }, 
    "env": { 
    "browser": true, 
    "node": true, 
    "es6": true 
    }, 
    "rules": { 
    "strict": 0, 
    "no-underscore-dangle": 0, 
    "quotes": [ 
     2, 
     "single" 
    ], 
    } 
}

fonte

2015-12-12 CodeOcelot

Il 'arrowFunctions' che già includi dovrebbe coprirlo. Questo potrebbe essere un caso non supportato, un bug o lo stile della convenzione –

ESLint che genera l'errore o il transpiler? –

Hai provato a usare babel-eslint? – FakeRainBrigand

Se si desidera utilizzare funzioni sperimentali (come frecce come metodi di classe) è necessario utilizzare babel-eslint come un parser. Il parser predefinito (Espree) non supporta le funzionalità sperimentali.

fonte

2015-12-13 16:14:39

Altri dettagli qui https://medium.com/@chestozo/fixing-eslint-no-invalid- questo-error-per-fat-freccia-class-metodi-a56908ca8bb6 – chestozo

tuo campione non è valido ES6, quindi non c'è alcun modo per configurare eslint per permettergli

fonte

2015-12-12 23:03:31

@Bergi: Oops, rileggete la domanda e la risposta, cancellate il mio commento. –

handleClick è un metodo di la classe, quindi non è necessario =:

class App extends React.Component{ 
    ... 
    handleClick(evt) { 
    ... 
    } 
}

se è statica che si può fare:

class App extends React.Component{ 
    static handleClick = (event) => { } 
}

e per legame lettura this o utilizzare auto-bind decorator

fonte

2015-12-13 00:04:37 yonatanmn

no. 'handleClick = (event) => {}' è associato all'istanza della classe invece di inutile 'handleClick() {}' – Atombit

Da quello che ho letto nel messaggio di errore Parsing error: Unexpected token = sembra più un errore di parser di quello di lintero.

Supponendo che si sta utilizzando Babel come JavaScript compilatore/transpiler e babel-eslint come parser ESLint, è probabile che si tratta di Babel lamentano la sintassi, non ESLint.

Il problema non riguarda le funzioni di freccia ma qualcosa di più sperimentale (ES7 ??) che penso sia chiamato property initializer o class instance field (o entrambi :)).

Se si desidera utilizzare questa nuova sintassi/funzione è necessario abilitare preset-stage-1 in Babel. Questo preset include il plug-in syntax-class-properties che consente tale sintassi.

Riassumendo:

Installare babel preimpostata:
```
npm install babel-preset-stage-1 
```
Aggiungi questo preset alla lista dei vostri preset (si suppongo stanno già utilizzando es2015 e react preset), sia in il tuo .babelrc o nel tuo campo di query babel-loader se stai usando il webpack.
```
"presets": ["es2015", "stage-1", "react"] 
```