javascript - autoprefixer watch 任务配置

Question

目前我正在使用 Autoprefixer在我的 gulpfile.js 中。但是，它仅适用于设置了监视任务!这可能是因为我没有正确引用 return gulp.src('./site/css/*.css')。

以下是 autoprefixer 如何设置 autoprefixer 任务

gulp.task('autoprefixer', function () {
    var postcss      = require('gulp-postcss');
    var sourcemaps   = require('gulp-sourcemaps');
    var autoprefixer = require('autoprefixer');

    return gulp.src('./src/*.css')
        .pipe(sourcemaps.init())
        .pipe(postcss([ autoprefixer({ browsers: ['last 2 versions'] }) ]))
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest('./dest'));
});

这是我的 gulpfile.js 中的 autoprefixer 任务

gulp.watch('./site/css/main.css',['autoprefixer']);

gulp.task('autoprefixer',function () {
    var postcss = require('gulp-postcss');
    var sourcemaps = require('gulp-sourcemaps');
    var autoprefixer = require('autoprefixer');

    return gulp.src('./site/css/*.css')
        .pipe(sourcemaps.init())
        .pipe(postcss([ autoprefixer({ browsers: ['> 1%','last 2 versions'] }) ]))
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest('./site/css'));
});

链接到整个 gulpfile.js file和 repo我正在与之合作。

Answer 1

您可以通过从 cmd 行执行 gulp autoprefixer 直接调用您的 autoprefixer 任务，或者您可以将其添加为另一个任务的依赖项。像这样:

gulp.task('someTask', ['autoprefixer'], function () {
    //  Do stuff
});

请参阅文档的相关部分 here .

已编辑

autoprefixer 任务将在其依赖任务执行之前执行(在我的示例中为“someTask”)，因此请注意此处的执行流程。