Gulp-autoprefixer arrojando ReferenceError: Promise no está definida

81

Intento hacer una compilación de trago mi sass y luego autoprefixit con gulp-autoprefixerpero obtengo un error.

var gulp = require('gulp'),
    sass = require('gulp-sass'),
    autoprefixer = require('gulp-autoprefixer');

gulp.task('test', function(){
    gulp.src('_sass/main.sass')
        .pipe(sass())
        .pipe(autoprefixer()) 
        .pipe(gulp.dest('./assets/css')); 
});

Estoy tratando de ejecutar esto Gulpfile.jsy estoy usando:

"gulp": "~3.9.0",
"gulp-sass": "~2.0.4",
"gulp-autoprefixer": "~3.0.1",

y versión NPM 1.3.10

Cuando corro, gulp testobtengo esto: 

/home/matei/Tests/test-4/node_modules/gulp-autoprefixer/node_modules/postcss/lib/lazy-result.js:152
        this.processing = new Promise(function (resolve, reject) {
                              ^
ReferenceError: Promise is not defined
    at LazyResult.async (/home/matei/Tests/test-4/node_modules/gulp-autoprefixer/node_modules/postcss/lib/lazy-result.js:152:31)
    at LazyResult.then (/home/matei/Tests/test-4/node_modules/gulp-autoprefixer/node_modules/postcss/lib/lazy-result.js:75:21)
    at DestroyableTransform._transform (/home/matei/Tests/test-4/node_modules/gulp-autoprefixer/index.js:28:13)
    at DestroyableTransform.Transform._read (/home/matei/Tests/test-4/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:172:10)
    at DestroyableTransform.Transform._write (/home/matei/Tests/test-4/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:160:12)
    at doWrite (/home/matei/Tests/test-4/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:326:12)
    at writeOrBuffer (/home/matei/Tests/test-4/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:312:5)
    at DestroyableTransform.Writable.write (/home/matei/Tests/test-4/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:239:11)
    at write (/home/matei/Tests/test-4/node_modules/gulp-sass/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:623:24)
    at flow (/home/matei/Tests/test-4/node_modules/gulp-sass/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:632:7)

Realmente no sé qué estoy haciendo mal. No funciona cuando uso sass o simple css. Creo que es algo con mis archivos.

node.js npm gulp autoprefixer Matei
fuente
1
No estoy seguro de qué tiene que ver esto con Sass (o CSS para el caso), cuando Autoprefixer arroja el error.
cimmanon
2
No estoy seguro de si esta es la solución o no ... pero su versión de NPM está desactualizada. Intente actualizar npm y todos sus paquetes, me he encontrado con peculiaridades extrañas como esta antes mientras ejecutaba compilaciones más antiguas.
Benjamin Solum

Respuestas:

78

Tuve el mismo problema. Para mí, la actualización del nodo no funcionó, pero agregar esto al comienzo de mi archivo gulp lo hizo:

require('es6-promise').polyfill();
Chris Searles
fuente
Esta es una buena "revisión", la mejor solución es actualizar node.js (ver la respuesta de @Matei)
Mark
1
@MonkeyKing como dije en mi respuesta, la actualización del nodo no resolvió el problema
Chris Searles
4
que paquete Recibocannot find module es6-promise
Victor
3
@Victor intenta ejecutar npm install es6-promiseen tu terminal
Michael
66

Actualicé node.js a la última versión usando:

# Using Ubuntu
curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash -
sudo apt-get install -y nodejs

para mi máquina Ubuntu, como se muestra aquí .

Después de eso, actualicé NPM usando:

sudo npm cache clean -f
sudo npm install -g n
sudo n stable

Como se muestra aquí .

Ahora el gulp-autoprefixercomienzo a trabajar pero recibí un error de gulp-sass. Lo actualicé usando esta instrucción:

  1. Elimina tu carpeta node_modules
  2. Elimine gulp-sass de su archivo package.json
  3. Elimine node-sass de su archivo package.json (si lo tiene allí)
  4. Ejecute npm install gulp-sass --save-dev
  5. Actualice su tarea de Gulp según sea necesario

Encontrado aquí . Ahora tengo "gulp-sass": "^2.0.4"y esto solucionó todos mis problemas.

Gracias por el consejo y la ayuda.

Matei
fuente
11
Puede empezar a node-sasstrabajar npm rebuild node-sassdespués de actualizar node.
Hugh Grigg 葛 修 远
simplemente funcionó muy bien. Gracias. también, el mensaje de la consola solicita ejecutar este comando cuando encuentra un error al ejecutar la tarea
Pushpak Patel
1
De hecho, este es un problema de la versión de NodeJS, consulte github.com/sindresorhus/gulp-autoprefixer/issues/45
tricasse
Buenas instrucciones. Las instrucciones independientes del
toad
No necesitaba esos pasos: sudo npm cache clean -f sudo npm install -g n sudo n stabley solía npm rebuild node-sasssolucionar el problema de node-sass. :)
Edu Ruiz
29

Instale es6-promise en la ubicación de su proyecto donde existe package.json

npm install es6-promise

Luego haga que la primera línea de su gulpfile.js sea el siguiente código: 

var Promise = require('es6-promise').Promise;
Hari Gillala
fuente
2

Esto no responde a la pregunta directamente, pero podría ser útil para las personas que obtienen este error al intentar ejecutar el tutorial de ionic 2.

Como señalan otras respuestas, el problema es que es6-promisefalta.

Recibí el mismo error al intentar iniciar el tutorial de ionic 2 ( https://github.com/driftyco/ionic2-starter-tutorial ): (mi versión de ionic 2 es 2.0.0-beta.25 y la última confirmación del tutorial es ed9ef2fcce887e4d1c08c375c849b06b8394bad7 )

Este es el seguimiento de la pila que obtuve al intentar ejecutar la aplicación con ionic serve:

Running 'serve:before' gulp task before serve
[18:37:00] Starting 'clean'...
[18:37:01] Finished 'clean' after 1.02 s
[18:37:01] Starting 'watch'...
[18:37:01] Starting 'sass'...
[18:37:01] Starting 'html'...
[18:37:01] Starting 'fonts'...
[18:37:01] Starting 'scripts'...
[18:37:01] Finished 'scripts' after 62 ms
[18:37:01] Finished 'html' after 72 ms
[18:37:01] Finished 'fonts' after 77 ms
Caught exception:
 ReferenceError: Promise is not defined
    at LazyResult.async (/home/stitakis/dev/playground/ionic2/myTutorial/node_modules/ionic-gulp-sass-build/node_modules/gulp-autoprefixer/node_modules/postcss/lib/lazy-result.js:157:31)
    at LazyResult.then (/home/stitakis/dev/playground/ionic2/myTutorial/node_modules/ionic-gulp-sass-build/node_modules/gulp-autoprefixer/node_modules/postcss/lib/lazy-result.js:79:21)
    at DestroyableTransform._transform (/home/stitakis/dev/playground/ionic2/myTutorial/node_modules/ionic-gulp-sass-build/node_modules/gulp-autoprefixer/index.js:24:6)
    at DestroyableTransform.Transform._read (/home/stitakis/dev/playground/ionic2/myTutorial/node_modules/ionic-gulp-sass-build/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:159:10)
    at DestroyableTransform.Transform._write (/home/stitakis/dev/playground/ionic2/myTutorial/node_modules/ionic-gulp-sass-build/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:147:83)
    at doWrite (/home/stitakis/dev/playground/ionic2/myTutorial/node_modules/ionic-gulp-sass-build/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:313:64)
    at writeOrBuffer (/home/stitakis/dev/playground/ionic2/myTutorial/node_modules/ionic-gulp-sass-build/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:302:5)
    at DestroyableTransform.Writable.write (/home/stitakis/dev/playground/ionic2/myTutorial/node_modules/ionic-gulp-sass-build/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:241:11)
    at DestroyableTransform.ondata (/home/stitakis/dev/playground/ionic2/myTutorial/node_modules/ionic-gulp-sass-build/node_modules/gulp-sass/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:531:20)
    at DestroyableTransform.EventEmitter.emit (events.js:95:17)

Nuevamente, como lo señalan otras respuestas, así es como se resuelve esto:

  1. edite gulpfile.js y agregue en la línea 6: require('es6-promise').polyfill();

  2. instale la dependencia que falta con: npm install es6-promise --save

Después de estos cambios, el problema se solucionó y pude iniciar el servidor local.

stitakis
fuente
Esto solucionó el problema para mí, todo lo que tenía que hacer era usar npm install es6-promise con --save, y usar este require con .pollyfill, usando .Promise () como en un awnser anterior no funcionó para mí.
killstreet