2014-09-29 11 views
5

Ich verwende Schluck mit autoprefixer in meinem Projekt, und ich habe zu Hintergründe Gradienten wie folgt verwenden:schluck autoprefixer nicht hinzufügen moz Präfix

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

aber Ausgang ist:

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

Was falsch mit mir?

Teil 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 mit schluck-autoprefixer

auch wenn Iam

browsers: ['Firefox 14'] 

Ausgang noch Einstellung:

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

Verwenden Sie 'gulp-prefix' oder' gulp-autoprefixer'? –

+0

gulp-autoprefixer – betmakh

Antwort

8

Use "autoprefixer-core" mit "Schluck-postcss". Anwendungsbeispiel:

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

Wenn Sie http://caniuse.com/#search=linear-gradient überprüfen, sehen Sie, dass Firefox seit mindestens Version 30 das Präfix moz- nicht benötigt. Version Version 30 hat einen globalen Marktanteil von < 1% und Sie haben gesetzt '> 1%'

0

Nichts ist falsch, alles scheint zu funktionieren wie erwartet.

Die Sache ist Firefox nicht den -moz Präfix benötigt, da die v16, und selbst wenn Sie Firefox 14 eingestellt haben, ist 0.04% die globale Browser-Nutzung dieser Version von Can I Use berichtet und Sie haben > 1% so ist es nicht präzisieren zu Ihrer Ausgabe hinzugefügt.

Wenn Sie wirklich das -moz Präfix für Firefox 14 hinzufügen möchten, sollten Sie > 1% aus der browsers Liste entfernen.

0

Es gibt einen Fehler mit gulp-autprefixer.Keine Möglichkeit, "-moz-" Präfix hinzuzufügen.

Autoprefixer Standalone funktioniert gut: http://jsfiddle.net/tsvppawk/

Die gleiche Abfrage "Firefox> = 2" in schluck-atuprefixer erzeugt:

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