Gulp autoprefixer gives me a promise

Question

I tried this solution from Gulp Autoprefixer Not Working , but this does not work for me.

The code I use is:

"use strict"; var gulp = require('gulp'); var sass = require('gulp-sass'); var prefix = require('gulp-autoprefixer'); var minify = require('gulp-minify-css'); var plumber = require('gulp-plumber'); function onError(err) { console.log(err); } gulp.task('sass', function(){ return gulp.src('src/style.scss') .pipe(sass()) .pipe(prefix({browsers:['last 2 versions']})) .pipe(minify()) .pipe(gulp.dest('css/')) .pipe(plumber({ errorHandler: onError })) }); 

I get this error message:

 /Users/krisvandermast/gulptests/area512/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 (/Users/krisvandermast/gulptests/area512/node_modules/gulp-autoprefixer/node_modules/postcss/lib/lazy-result.js:152:31) at LazyResult.then (/Users/krisvandermast/gulptests/area512/node_modules/gulp-autoprefixer/node_modules/postcss/lib/lazy-result.js:75:21) at DestroyableTransform._transform (/Users/krisvandermast/gulptests/area512/node_modules/gulp-autoprefixer/index.js:28:13) at DestroyableTransform.Transform._read (/Users/krisvandermast/gulptests/area512/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:172:10) at DestroyableTransform.Transform._write (/Users/krisvandermast/gulptests/area512/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:160:12) at doWrite (/Users/krisvandermast/gulptests/area512/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:326:12) at writeOrBuffer (/Users/krisvandermast/gulptests/area512/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:312:5) at DestroyableTransform.Writable.write (/Users/krisvandermast/gulptests/area512/node_modules/gulp-autoprefixer/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:239:11) at write (/Users/krisvandermast/gulptests/area512/node_modules/gulp-sass/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:623:24) at flow (/Users/krisvandermast/gulptests/area512/node_modules/gulp-sass/node_modules/through2/node_modules/readable-stream/lib/_stream_readable.js:632:7) 

Answer 1

I opened an error for GitHub: https://github.com/sindresorhus/gulp-autoprefixer/issues/45 .

It turned out that I needed to upgrade my version of Node.js to 4. Now it is 4.1.0 and the following code works:

package.json

 { "name": "a", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "Kris van der Mast", "license": "ISC", "devDependencies": { "gulp": "^3.9.0", "gulp-autoprefixer":"^3.0.1" } } 

gulpfile.js

 "use strict"; var gulp = require('gulp'), autoprefixer = require('gulp-autoprefixer'); gulp.task('default', function () { return gulp.src('src/app.css') .pipe(autoprefixer({ browsers: ['last 2 versions'], cascade: false })) .pipe(gulp.dest('dist')); }); 

app.css

 body { opacity: .5; box-sizing: border-box; transform: scale(.5); display: flex; } 

Run gulp at this point and get the following output:

app.css after prefix

 body { opacity: .5; box-sizing: border-box; -webkit-transform: scale(.5); transform: scale(.5); display: -webkit-flex; display: -ms-flexbox; display: flex; }