C'è un modo per attivare il supporto della sintassi ES6 / ES7 in vscode?


103

Modifica 3: a partire dalla versione 0.4.0, la sintassi di ES6 può essere attivata aggiungendo un jsconfig.jsonfile alla cartella del progetto con i seguenti contenuti:

{
    "compilerOptions": {
        "target": "ES6"
    }
}

Modifica 2: puoi votare per questa funzione sulla voce dell'utente


C'è un modo per "attivare" ES6 / ES7 in Visual Studio Code?

immagine dello schermo

Modifica 1

Ho provato il suggerimento di @ sarvesh - overrode javascript.validate.targete riavviato vscode. Non ha aiutato.


3
Ti dispiacerebbe metterlo come risposta piuttosto che come modifica alla tua domanda?
Jeroen Vannevel

Risposte:


28

Attualmente, l'unico modo per utilizzare le funzionalità ES6 ed ES7 è utilizzare Typescript .

D'altra parte, qui puoi vedere che c'è una richiesta di funzionalità per ES6 ed ES7


1
Aggiornamento: Looks ES6 sarà disponibile a partire da luglio 2015 - visualstudio.uservoice.com/forums/293070-visual-studio-code/…
ToddSmithSalter

Sembra abbastanza buono. Tuttavia, c'è del lavoro da fare in generale.
mzdv

2
Sto usando l'ultima versione 0.8.0vedo ancora la colorazione degli errori per le funzioni della freccia grossa ... perché?
vanthome

@vanthome devi indicare l'array di file che vuoi scrivere con es6, controlla il link: code.visualstudio.com/Docs/languages/javascript
TlonXP

@TionXP intendi l'approccio con jsconfig.json? Beh, non l'ho provato, ma mi aspetto che funzioni se lo abilito a livello globale. Non voglio dire a VSCode file per file che voglio usare ES6.
vanthome

58

È abbastanza facile, alla radice del tuo progetto crea un file jsconfig.json e scrivi questo oggetto al suo interno:

{
    "compilerOptions": {
        "target": "ES6",
        "module": "commonjs"
    }
}

Funziona alla grande, grazie! Apparentemente hanno incluso questo in vscode questa estate: blogs.msdn.com/b/vscode/archive/2015/07/06/vs-code-es6.aspx Quindi la risposta sopra non è più corretta.
Tom

9
aggiungi "experimentalDecorators": trueper decoratori es7
Meirion Hughes

E le importazioni ES6? Funzionerà il debug / i punti di interruzione? Non sembra funzionare con "module": "es2015".
arve0

Questo non funziona per me, ho questo problema con i ragazzi stackoverflow.com/questions/35110019/…
jack vuoto

43

Questo collegamento ha aiutato molto. Aggiungere il file jsconfig.json al progetto non ha aiutato molto o meglio non è la soluzione migliore. Vai a file> preferenze> impostazioni. Nel file settings.json aggiungi questa riga:

"jshint.options": { "esversion": 6 }

5

Aggiungendo alle risposte precedenti ...

Come da Docs of VS Code ..

Assicurati di posizionare jsconfig.json alla radice del tuo progetto JavaScript e non solo alla radice del tuo spazio di lavoro. Di seguito è riportato un file jsconfig.json che definisce la destinazione JavaScript come ES6 e l'attributo exclude esclude la cartella node_modules.

{
    "compilerOptions": {
        "target": "ES6"
    },
    "exclude": [
        "node_modules"
    ]
}

Ecco un esempio con un attributo di file esplicito.

{
    "compilerOptions": {
        "target": "ES6"
    },
    "files": [
        "src/app.js"
    ]
}

L'attributo files non può essere utilizzato insieme all'attributo exclude. Se vengono specificati entrambi, l'attributo files ha la precedenza.

prova anche a modificare la proprietà "target" in tsconfig.json

{
  "compilerOptions": {
    "target": "es5",//es6
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ]
}

Cosa significa: "alla radice del tuo progetto JavaScript e non solo alla radice del tuo spazio di lavoro"?
Jared Christensen

Perché il codice vs non può semplicemente raccogliere .babelrcecc.? Perché tutta la configurazione duplicata? grumbl
Stijn de Witt



0

A partire da questa data e in base alla documentazione ESLint su VSCode Marketplace, incluso un file di configurazione .eslintrc nella radice del progetto abilita il lint ES6 nell'estensione ESLint VSCode.

Il mio file di configurazione .eslintrc ha questo aspetto:

extends:
  - standard
parser: babel-eslint
rules:
  object-curly-spacing: [ error, always ]
  react/prop-types: off
  space-before-function-paren: off

Ho installato eslint tramite npm in node_modules e tutto quello che so è che con .eslintrc nella cartella principale del progetto ES6 linting funziona e senza di esso non funziona.

Spero che questo ti aiuti...

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.