1

我正在使用 _s(下划线)启动 WordPress 主题并尝试使用我自己的 gulp 脚本来执行以下操作:

  • 从 ./sass/ 编译 sass 文件(有许多 scss 文件都作为“导入”添加到 ./sass/style.scss 中)
  • 为我的 CSS 自动添加前缀
  • 创建源映射文件
  • compile/autoprefix/sourcemapped 文件应位于名为 style.css 和 style.css.map 的主题 (./) 的根目录中

我让它正常工作 - 它确实生成了我的 style.css 和 style.css.map - 但它只是不添加浏览器前缀。就像 autoprefixer 插件不工作一样。

如何让 autoprefixer 为我的 CSS 添加前缀?我通过添加 transition: all .5s, display: grid 对其进行了测试,并且它们没有前缀。

也没有错误,所以我很茫然。

这是我的 gulpfile.js

'use strict';
var gulp = require('gulp');
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');
var sourcemaps = require('gulp-sourcemaps');
sass.compiler = require('node-sass');

gulp.task('sass', function () {
   return gulp.src('./sass/**/*.scss')
   .pipe(sass().on('error', sass.logError))

    // Compile Sass
    .pipe(sourcemaps.init())
    .pipe(sass())
    .pipe(sourcemaps.write())
    .pipe(gulp.dest('./'))

    // Autoprefix
    .pipe(sourcemaps.init({loadMaps: true}))
    .pipe(autoprefixer())
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest('./'))
});

 gulp.task('watch', function () {
    gulp.watch('./sass/**/*.scss', gulp.series('sass'));
  });
 gulp.task('default', function () {
    gulp.watch('./sass/**/*.scss', gulp.series('sass'));
  });
4

0 回答 0