css - Less CSS - 在开发环境中使用 less.js 添加供应商前缀

Question

我正在使用 LESS与 Gulp .我也在使用 Autoprefixer plugin它根据 Browserlist 添加所有需要的供应商前缀.在为最终导出创建所有缩小文件时，这非常有效。

我的问题是:当我在开发环境中使用 less.js 测试 CSS 时，没有添加供应商前缀。自动前缀似乎只适用于 cli。 有没有办法使用 less.js 或其他插件即时添加供应商前缀？我已经尝试运行 prefixfree在 less.js 之后，但没有运气。

Answer 1

只需将流从gulp-less 传输到自动前缀器，例如

gulp.task('styles', [], function () {
    return gulp.src('less/*.less')
        .pipe(gulplLss())
        .pipe(postcss([autoprefixer()]))
        .pipe(gulp.dest('css/'));
}

gulp.task('watch', function () {
    gulp.watch('less/*.less', 'styles');
}

(这是通过 postcss 工具使用 autoprefixer，这是现在推荐的方式。在弃用之前，autoprefixer 行应该是:.pipe(autoprefixer()))