mozilla - cross - el autoprefixer gulp no agrega el prefijo moz

rails autoprefixer

Question

Estoy usando gulp con autoprefixer en mi proyecto, y tengo que usar gradiente de fondos como este:

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

pero la salida es:

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

¿Que esta mal conmigo?

Parte de 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());
}); 

Estoy usando gulp-autoprefixer

incluso si estoy configurando

 browsers: [''Firefox 14'']

salida todavía:

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

Answer 1

Hay un error con gulp-autprefixer. No hay forma de agregar el prefijo "-moz-".

Autoprefixer standalone funciona bien: http://jsfiddle.net/tsvppawk/

La misma consulta "Firefox> = 2" en gulp-atuprefixer genera:

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

Answer 2

No pasa nada, todo parece funcionar como se esperaba.

El caso es que Firefox no necesita el prefijo v16 desde el v16 , e incluso si has configurado Firefox 14 , el uso global del navegador de esta versión reportada por Can I Use es 0.04% y has precisado > 1% por lo que es no agregado a su salida.

Si realmente desea agregar el prefijo -moz para Firefox 14 , debe eliminar > 1% de la lista de browsers .

Answer 3

Si marca http://caniuse.com/#search=linear-gradient , verá que Firefox ya que al menos la versión 30 no requiere el prefijo moz- . La versión 30 tiene una cuota de mercado global <1% y ha establecido ''> 1%''

Answer 4

Utilice "autoprefixer-core" con "gulp-postcss". Ejemplo de uso:

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")
  })
})