Gulp autoprefixer does not add moz prefix

Question

I am using gulp with autoprefixer in my project and I need to use the background gradient as follows:

background: linear-gradient(#e98a00, #f5aa2f); 

but conclusion:

 background:-webkit-linear-gradient(#e98a00,#f5aa2f); background:linear-gradient(#e98a00,#f5aa2f); 

What happened to me?

Part of Gulpfile.js

 gulp.task('styles', function() { return gulp.src(['css/less/mainPage.less']) .pipe(plumber()) // .pipe(concat('base.scss')) .pipe(less()) .pipe(prefix([{ browsers: ['IE 8', 'IE 9', 'last 5 versions', 'Firefox 14', 'Opera 11.1'] }])) .pipe(minifyCSS({keepBreaks: true})) .pipe(gulp.dest('css')) .pipe(connect.reload()); }); 

Iam using gulp -autoprefixer

even if iam setting

  browsers: ['Firefox 14'] 

conclusion:

  background:-webkit-linear-gradient(#e98a00,#f5aa2f); background:linear-gradient(#e98a00,#f5aa2f); 

Answer 1

Use "autoprefixer-core" with "gulp -postcss". Usage example:

 var MASK_SRC = "./src/mask/page0/"; var gulp = require("gulp") var plumber = require("gulp-plumber") var postcss = require('gulp-postcss'); var sourcemaps = require('gulp-sourcemaps'); var autoprefixer = require('autoprefixer-core'); var csso = require("gulp-csso") gulp.task("styles", function() { return gulp.src(MASK_SRC + "scss/*.css") //.pipe(plumber()) .pipe(postcss([ autoprefixer({ browsers: ["> 0%"] }) ])) //.pipe(csso()) .pipe(gulp.dest(MASK_SRC + "/css/")) }) gulp.task("dev", ["styles"], function() { gulp.watch(MASK_SRC + "scss/**/*", function(event) { gulp.run("styles") }) }) 

Answer 2

If you check http://caniuse.com/#search=linear-gradient , you will see that Firefox, since at least version 30 does not require the moz- prefix. Version 30 has a global market share of <1% and you have set '> 1%'

Answer 3

Nothing wrong, everything seems to work as expected.

Thing Firefox does not need the -moz prefix with v16 , and even if you installed Firefox 14 , the global browser use of this version, reported Can I use is 0.04% , and you specified > 1% so that it does not add to your output.

If you really want to add the -moz prefix for Firefox 14 , you must remove > 1% from the browsers list.

Answer 4

There is a bug with gulp -autprefixer.No way to add the prefix "-moz-".

Stand-alone autodetector works well: http://jsfiddle.net/tsvppawk/

The same request "Firefox> = 2" in gulp -atuprefixer generates:

 background: -webkit-linear-gradient(#e98a00, #f5aa2f); background: linear-gradient(#e98a00, #f5aa2f);