È possibile scrivere un file gulp in es6?

Question

Domanda: Come posso scrivere il mio file gulp in ES6 modo da poter utilizzare al posto di importrequire e utilizzare la sintassi => sopra function()?

Posso usare io.js o nodo qualsiasi versione.

---

gulpfile.js:

import gulp from "./node_modules/gulp/index.js"; 
gulp.task('hello-world', =>{ 
    console.log('hello world'); 
}); 

Errori:

import gulp from "./node_modules/gulp/index.js"; 
^^^^^^ 
SyntaxError: Unexpected reserved word 

---

gulp.task('hello-world', =>{ 
         ^^ 
SyntaxError: Unexpected token => 

All'interno del node_modules/gulp/bin/gulp.js ho cambiato la prima linea a #!/usr/bin/env node --harmony come richiesto in questo stack

Answer 1

Sì, è possibile utilizzare babel.

Assicurati di avere l'ultima versione di gulp-cli.

npm install -g gulp-cli

Installare babele come dipendenza del progetto.

npm install --save-dev babel

Rinominare gulpfile.js-gulpfile.babel.js

tuo gulpfile potrebbe essere simile a questa:

import gulp from 'gulp'; 

gulp.task('default',() => { 
    // do something 
}); 

Aggiornamento per Babel 6.0+ Come correttamente rilevato dalla Eric Bronniman, ci sono un alcuni passaggi aggiuntivi coinvolti nel far funzionare questo con l'ultima versione di Babele.Qui ci sono tali istruzioni:

Anche in questo caso, fare in modo di avere l'ultima versione di gulp-cli
npm install -g gulp-cli

quindi installare sorso, nucleo babel, e i preset es2015
npm install --save-dev gulp babel-core babel-preset-es2015

Poi , aggiungere il seguente a un file .babelrc o alla vostra package.json

"babel": { 
    "presets": [ 
    "es2015" 
    ] 
} 

tuo 01.233.947,479 miladeve essere denominato gulpfile.babel.js

Answer 2

Se si sta utilizzando la versione più moderna del Gulp e del Gulp CLI, si può solo fare Gulpfile.babel.js e sarà capire e trasponi il tuo gulpfile ES6 con BabelJS di default.

E 'anche importante avere il transpiler BabelJS installato sotto devDependencies come è Gulp:

npm install --save-dev babel 

notare che a richiedere gulp in questo contesto, non si dispone di importare il index.js, si può solo anche:

import gulp from 'gulp'; 

Answer 3

Nota ora è possibile utilizzare molte/molte funzioni di ES6 in Node.js v4.0.0 senza babel. Tuttavia apparentemente "import" non è ancora supportato. Vedere: https://nodejs.org/en/docs/es6/

Edit: La maggior parte delle caratteristiche ES6 popolari (tra cui destrutturazione e spread) sono supportati per impostazione predefinita in NodeJS 5.0 (vedi link qui sopra.) L'unica caratteristica mancante importante sembra essere moduli ES6 per quanto ne Posso dire.

Answer 4

Io uso babel-node e nativo gulp.

1. Installare babel e gulp come devDipendenze.
2. Scrivere gulpfile.js con sintassi ES6.
3. Utilizzare il comando ./node_modules/.bin/babel-node ./node_modules/.bin/gulp per eseguire sorso
4. Nella sezione package.json scripts, è possibile saltare la prima parte ./node_modules/.bin/ - come babel-node ./node_modules/.bin/gulp.

Il vantaggio di questo appoach è, un giorno in cui i node.js supportano tutte ES6 dispone di un giorno, tutto ciò che serve di opt-out babel runtime è quello di sostituire babel-node con node. Questo è tutto.

Answer 5

passi che ho seguito per sviluppare il codice per gulpfile in ES6:

• npm install gulp && sudo npm install gulp -g.
• Assicurati di utilizzare la versione aggiornata di Gulp. La versione corrente al momento della stesura di questa risposta era 3.9.1. Per controllare quale è installata la versione di gulp, tipo gulp -v
• npm install babel-core babel-preset-es2015-without-strict --save-dev
• Tipo touch .babelrc nel terminale

• Nel file .babelrc, aggiungere questo codice

  { "presets": ["es2015-without-strict"] }

• Creato il config gulp file con il nome gulpfile.babel.js

• Voila !!! Ora puoi scrivere il codice di configurazione per gulp in ES6.

Fonte:Using ES6 with Gulp - Mark Goodyear

Answer 6

In sostanza, ciò che è necessario per l'installazione utilizzando npm è gulp, gulp-babel e babel-resent-env, aggiungere "env" per l'array .babelrc preset, e utilizzare un gulpfile.babel.js file.

npm install gulp-babel --save-dev 

Alcune delle risposte menzionati babel-core, babel-preset-es2015, ecc Il funzionario Babel setup guide con Gulp è quello di utilizzare gulp-babel solo, mentre gulp-babel ha moduli dipendenze tra babel-core quindi non è necessario installare separatamente.

Chi preimpostato, è necessario utilizzare un preset per fare Babel effettivamente fare qualcosa, che si chiama Preset Env che determina automaticamente il Babel plugin è necessario, sulla base di ambienti supportati.

npm install babel-preset-env --save-dev 

e in .babelrc file di

{ 
    "presets": ["env"] 
}