在gulp-postcss内部或外部使用自动前缀有什么区别

Question

我正在使用Gulp并且已经独立使用了Gulp Autoprefixer，例如：

gulp.task('styles', function() {
    gulp.src('scss/**/*.scss')
        //.................
        .pipe(sass())
        .pipe(autoprefixer({
            browsers: [
              //..........
            ],
        }))
        //............
});

。但随后我看到 Gulp Postcss 插件，它似乎包装了非 gulp 自动前缀器的使用，例如：

gulp.task('styles', function() {
    gulp.src('scss/**/*.scss')
    //.................
            .pipe(sass())
            .pipe(postcss([
                autoprefixer({
                    browsers: [
                        //.......
                    ],
                }),
            ]))
    //............
});

有什么区别？

Answer 1

Autoprefixer 只是一个 PostCSS 插件。没有PostCSS就无法运行它。

gulp-autoprefixer 将 PostCSS 隐藏在里面。就像gulp-postcss(autoprefixer)的捷径.这是运行自动前缀的非官方方式。

Autoprefixer 作者建议只使用 gulp-postcss ，因为：

• 您将更快地获得自动前缀更新。
• 您可以将自动前缀器与其他基于 PostCSS 的工具结合使用以提高性能。解析步骤（CSS处理中最长的）对于所有基于PostCSS的工具（包括Autoprefixer）将只执行一次。
• 这是官方方式，Autoprefixer和PostCSS团队对其进行了更好的测试。