gulp-autoprefixer不工作

我只是不能讓gulp-autoprefixer工作。我用轉換測試它，但是當我保存我的scss文件時，前綴不會顯示在我的css文件中。其他一切似乎都很好。gulp-autoprefixer不工作

這是我一飲而盡文件：

var gulp = require('gulp'), 
    plumber = require('gulp-plumber'), 
    rename = require('gulp-rename'), 
    autoprefixer = require('gulp-autoprefixer'), 
    imagemin = require('gulp-imagemin'), 
    cache = require('gulp-cache'), 
    sass = require('gulp-sass'), 
    browserSync = require('browser-sync'); 

gulp.task('browser-sync', function() { 
    browserSync({ 
    server: { 
     baseDir: "./" 
    } 
    }); 
}); 

gulp.task('bs-reload', function() { 
    browserSync.reload(); 
}); 

gulp.task('images', function(){ 
    gulp.src('build/images/**/*') 
    .pipe(cache(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true }))) 
    .pipe(gulp.dest('images/')); 
}); 

gulp.task('styles', function(){ 
    gulp.src(['scss/**/*.scss']) 
    .pipe(plumber({ 
     errorHandler: function (error) { 
     console.log(error.message); 
     this.emit('end'); 
    }})) 
    .pipe(sass()) 
    .pipe(autoprefixer('last 2 versions')) 
    .pipe(gulp.dest('css/')) 
    .pipe(browserSync.reload({stream:true})) 
}); 


gulp.task('default', ['browser-sync'], function(){ 
    gulp.watch("scss/**/*.scss", ['styles']); 
    gulp.watch("*.html", ['bs-reload']); 
});

感謝大家的幫助！

UPDATE

var gulp = require('gulp'), 
    plumber = require('gulp-plumber'), 
    rename = require('gulp-rename'), 
    autoprefixer = require('gulp-autoprefixer'), 
    imagemin = require('gulp-imagemin'), 
    cache = require('gulp-cache'), 
    sass = require('gulp-sass'), 
    browserSync = require('browser-sync'); 

gulp.task('browser-sync', function() { 
    browserSync({ 
    server: { 
     baseDir: "./" 
    } 
    }); 
}); 

gulp.task('bs-reload', function() { 
    browserSync.reload(); 
}); 

gulp.task('images', function(){ 
    gulp.src('build/images/**/*') 
    .pipe(cache(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true }))) 
    .pipe(gulp.dest('images/')); 
}); 

gulp.task('styles', function(){ 
    gulp.src(['scss/**/*.scss']) 
    .pipe(plumber({ 
     errorHandler: function (error) { 
     console.log(error.message); 
     this.emit('end'); 
    }})) 
    .pipe(sass()) 
    .pipe(autoprefixer({ 
      browsers: ['last 2 versions'], 
      cascade: false 
     })) 
    .pipe(gulp.dest('css/')) 
    .pipe(browserSync.reload({stream:true})) 
}); 


gulp.task('default', ['browser-sync'], function(){ 
    gulp.watch("scss/**/*.scss", ['styles']); 
    gulp.watch("*.html", ['bs-reload']); 
});

來源

2017-04-18 Tiago

按照documentation，實施對你有什麼稍有不同：

const gulp = require('gulp'); 
const autoprefixer = require('gulp-autoprefixer'); 

gulp.task('default',() => 
    gulp.src('src/app.css') 
     .pipe(autoprefixer({ 
      browsers: ['last 2 versions'], 
      cascade: false 
     })) 
     .pipe(gulp.dest('dist')) 
);

現在專門通過含有browsers作爲數組的對象。

這可能取決於您使用的版本，因爲我的Gulpfiles使用的語法看起來更像您的語法。

來源

2017-04-18 16:03:45 Toby

謝謝。我試圖在我的例子中實現它，但它只是不想工作。 – Tiago

您的autoprefixer管道是否與我的答案中顯示的內容匹配？你可以嘗試安裝和添加[gulp-debug]（https://www.npmjs.com/package/gulp-debug），它可以讓你註銷任務中發生的事情。 – Toby

因爲我有更多的東西在同一個函數中進行，所以我有點不確定把新代碼放在哪裏。我現在有這樣的功能： gulp.task（'styles'，function（）{gulp.src（['scss/**/*。scss']） .pipe（管道工（{errorHandler：函數（誤差）{ 的console.log（返回Error.message）; this.emit（ '結束'）;} }）） .pipe（SASS（）） .pipe（autoprefixer（{ 瀏覽器：[」（'css /'）） .pipe（browserSync.reload（{stream：true}））） } – Tiago

gulp-autoprefixer不工作

回答

相關問題