2014-09-29 17 views
5

मैं अपने प्रोजेक्ट में autoprefixer साथ घूंट उपयोग कर रहा हूँ नहीं जोड़ता है, और मैं इस तरह पृष्ठभूमि ढाल का उपयोग करने के:घूंट autoprefixer moz उपसर्ग

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

लेकिन उत्पादन होता है:

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

क्या मेरे साथ गलत है? 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 की

भाग

का उपयोग कर घूंट-autoprefixer भले ही Iam की स्थापना

browsers: ['Firefox 14'] 

उत्पादन अभी भी:

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

क्या आप 'gulp-prefix' या' gulp-autoprefixer' का उपयोग कर रहे हैं? –

+0

gulp-autoprefixer – betmakh

उत्तर

8

उपयोग "autoprefixer कोर" के साथ "घूंट-postcss"। उपयोग उदाहरण:

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

यदि आप http://caniuse.com/#search=linear-gradient चेक करते हैं, तो आप देखेंगे कि कम से कम संस्करण 30 के बाद फ़ायरफ़ॉक्स को moz- उपसर्ग की आवश्यकता नहीं है। संस्करण संस्करण 30 में < 1% का वैश्विक बाजार हिस्सा है और आपने '> 1%'

0

कुछ भी गलत नहीं है, सभी अपेक्षा के अनुसार काम करते हैं।

बात Firefoxv16 के बाद से -moz उपसर्ग की जरूरत नहीं है, और आप Firefox 14, इस संस्करण Can I Use द्वारा रिपोर्ट की वैश्विक ब्राउज़र उपयोग 0.04% है की स्थापना की है, भले ही और आप > 1% precised दिया है ताकि यह नहीं है आपके आउटपुट में जोड़ा गया।

तुम सच में Firefox 14 के लिए -moz उपसर्ग जोड़ना चाहते हैं, तो आप browsers सूची से > 1% निकाल देना चाहिए।

0

gulp-autprefixer के साथ एक बग है "-moz-" उपसर्ग जोड़ने का कोई तरीका नहीं है।

Autoprefixer स्टैंडअलोन अच्छी तरह से काम करता है: http://jsfiddle.net/tsvppawk/

समान क्वेरी "फ़ायरफ़ॉक्स> = 2" में घूंट-atuprefixer उत्पन्न करता है:

background: -webkit-linear-gradient(#e98a00, #f5aa2f); 
background: linear-gradient(#e98a00, #f5aa2f); 
संबंधित मुद्दे