我正在尝试设置一个Gulp任务,将Sass转换为CSS然后缩小它。
这是我目前的gulpfile.js
// include gulp
var gulp = require('gulp');
var sass = require('gulp-sass');
var minifyCss = require('gulp-minify-css');
//gulp sass
gulp.task('sass', function () {
gulp.src('./scss/main.scss')
.pipe(sass().on('error', sass.logError))
.pipe(gulp.dest('./css'));
});
gulp.task('minify-css', function() {
return gulp.src('css/*.css')
.pipe(minifyCss({compatibility: 'ie8'}))
.pipe(gulp.dest('css'));
});
gulp.task('sass:watch', function () {
gulp.watch('./scss/main.scss', ['sass','minify-css']);
});
我运行gulp sass:watch
并且我希望它将main.scss
转换为main.css
,然后我会看到它也运行minify-css
,但实际上并没有缩小它。
如果我运行gulp minify-css
,它就能完美运行。有人可以告诉我这是如何调整的,以便gulp.watch
一个接一个地运行这两个任务吗?
谢谢
答案 0 :(得分:0)
通过删除附加任务并将css minify组合到sass部分,看起来我得到了这项工作。
body {
color: red; /*All major browsers */
color: green/9; /* IE Only */
}