我缩小了从SASS生成的CSS。切换到Gulp 4后有问题重命名并缩小CSS。
所有gulp插件都已正确安装。除了缩小和重命名CSS之外,一切顺利。
这是我的代码:
const browserSync = require('browser-sync').create();
const run = require('gulp-run');
const del = require('del');
var gulp = require("gulp");
var rename = require("gulp-rename");
var log = require("fancy-log");
// Include paths file
//const paths = require('./src/paths');
/************************************ CSS ************************************/
gulp.task("css:compile", function () {
var postcss = require("gulp-postcss");
var sourcemaps = require("gulp-sourcemaps");
var autoprefixer = require("autoprefixer");
var sass = require("gulp-sass");
return gulp
.src("./src/scss/*.scss")
.pipe(sourcemaps.init())
.pipe(
sass({
includePaths: ["node_modules/bootstrap/scss/"]
}).on("error", sass.logError)
)
.pipe(postcss([autoprefixer()]))
.pipe(sourcemaps.write("."))
.pipe(gulp.dest("./www/css/"));
});
gulp.task("css:minify", gulp.series(["css:compile"]), function () {
var cleanCSS = require("gulp-clean-css");
return gulp
.src("./www/css/main.css")
.pipe(cleanCSS())
.pipe(rename("main.min.css"))
.pipe(gulp.dest("./www/css/"));
});
gulp.task("img", function () {
var imagemin = require("gulp-imagemin");
return gulp.src("src/img/*")
.pipe(imagemin())
.pipe(gulp.dest("./www/img/"))
});
gulp.task("css", gulp.series(["css:minify"]));
在这两行代码中:
gulp.task("css:minify", gulp.series(["css:compile"]), function () {
gulp.task("css", gulp.series(["css:minify"]));
我不认为gulp.series
可以将数组作为其第一个参数。将它们更改为:
gulp.task("css:minify", gulp.series("css:compile"), function () {
gulp.task("css", gulp.series("css:minify"));