Я использую Gulp в своем проекте и хочу использовать autoprefixer.Gulp - AutoPrefixer не работает должным образом
Мой текущий файл глотком выглядит следующим образом:
// Include gulp
var gulp = require('gulp');
// Include plugins
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var sass = require('gulp-ruby-sass');
var autoprefixer = require('gulp-autoprefixer');
var imagemin = require('gulp-imagemin');
var cache = require('gulp-cache');
// Concatenate & Minify JS
gulp.task('scripts', function() {
return gulp.src('js/*.js')
.pipe(concat('main.js'))
.pipe(rename({suffix: '.min'}))
.pipe(uglify())
.pipe(gulp.dest('build/js'));
});
gulp.task('sass', function() {
return sass('scss/style.scss', {style: 'compressed'})
.pipe(autoprefixer({
browsers: ['last 2 versions'],
cascade: false
}))
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('build/css'));
});
gulp.task('images', function() {
return gulp.src('images/**/*')
.pipe(cache(imagemin({ optimizationLevel: 5, progressive: true, interlaced: true })))
.pipe(gulp.dest('build/img'));
});
gulp.task('watch', function() {
// Watch .js files
gulp.watch('js/*.js', ['scripts']);
// Watch .scss files
gulp.watch('scss/*.scss', ['sass']);
// Watch image files
gulp.watch('images/*', ['images']);
});
// Default Task
gulp.task('default', ['scripts', 'sass', 'images', 'watch']);
Как вы можете видеть, у меня есть .sass задачу, которая работает, как ожидалось. Я добавил
.pipe(autoprefixer({
browsers: ['last 2 versions'],
cascade: false
}))
перед тем, как его миниатюрировать в файл min.css. Теперь, когда я запускаю это, все кажется прекрасным. Но, к примеру, когда я сохранить этот код:
.test{
transform: scale(.5);
}
Id ожидать иметь -webkit- версии и т.д. добавлены в мой файл min.css, но по какой-то причине он не делает. Кто-нибудь есть идея, где ошибка может быть?
Он никогда не добавляет префикс -webkit? Возможно, некоторым правилам не нужен префикс для последних двух версий браузера ... – MMachinegun
Он просто ничего не добавляет, кроме transform: scale (.5); –
Средство autoprefixer использует базу данных с сайта caniuse.com. На caniuse говорит, что последние 2 версии браузера не поддерживают префикс «-webkit-». Если вам нужно поддерживать некоторые действительно старые префиксы, введите последние 40 версий или что-то в этом роде. Последние поддерживаемые версии: caniuse.com/#search=transform%3A%20scale – Phil