无法让 gulp 自动前缀工作答案

【问题标题】：Unable to get gulp autoprefixer working无法让 gulp 自动前缀工作
【发布时间】：2017-11-15 21:19:35
【问题描述】：

我目前正在使用 gulp 设置一个新项目，但我无法让 gulp-autoprefixer 工作。

到目前为止，下面是我的 gulpfile.js。

var gulp = require('gulp'),
    sass = require('gulp-sass'),
    prefix = require('gulp-autoprefixer'),
    rename = require('gulp-rename'),
    livereload = require('gulp-livereload'),
    sourcemaps = require('gulp-sourcemaps');

gulp.task('styles', function() {
  gulp.src('css/**/*.scss')
    .pipe(sourcemaps.init())
    .pipe(prefix('last 2 version'))
    .pipe(sass().on('error', sass.logError))
    .pipe(sourcemaps.write('./'))
    .pipe(rename({suffix: '.min'}))
    .pipe(gulp.dest('./css/'));
});

gulp.task('default',function() {
  gulp.watch('css/**/*.scss',['styles']);
  livereload.listen();
  gulp.watch(['./**/*']).on('change', livereload.changed);
});

【问题讨论】：

标签： gulp gulp-sass

【解决方案1】：

设法修复它，见下文。

var gulp = require('gulp'),
    sass = require('gulp-sass'),
    autoprefixer = require('gulp-autoprefixer'),
    rename = require('gulp-rename'),
    livereload = require('gulp-livereload'),
    sourcemaps = require('gulp-sourcemaps');

gulp.task('styles', function() {
  gulp.src('src/css/**/*.scss')
    .pipe(sourcemaps.init())
    .pipe(sass().on('error', sass.logError))
    .pipe(autoprefixer({
      browsers: ['last 2 versions'],
      cascade: false
    }))
    .pipe(sourcemaps.write('./'))
    .pipe(rename({suffix: '.min'}))
    .pipe(gulp.dest('./dist/css/'));
});

gulp.task('default',function() {
  gulp.watch('src/css/**/*.scss',['styles']);
  livereload.listen();
  gulp.watch(['./**/*']).on('change', livereload.changed);
});

【讨论】：