How to I go about combining my styles task my browser-sync and my watch task into one gulp default command?
Here is what I have so far.
var gulp = require("gulp");
var sass = require("gulp-sass");
var browserSync = require("browser-sync").create();
gulp.task("styles", function() {
gulp
.src("sass/**/*.scss")
.pipe(sass().on("error", sass.logError))
.pipe(gulp.dest("./css/"));
});
// Static server
gulp.task("browser-sync", function() {
browserSync.init({
server: {
baseDir: "./"
}
});
});
//Watch task
gulp.task("default", function() {
gulp.watch("sass/**/*.scss", gulp.series("styles"));
});
I have also tried this from the browser-sync documentation but it gives me the error AssertionError [ERR_ASSERTION]: Task function must be specified With the same variables at the top.
gulp.task("serve", ["sass"], function() {
browserSync.init({
server: "./"
});
gulp.watch("/sass/*.scss", ["sass"]);
gulp.watch("/*.html").on("change", browserSync.reload);
});
// Compile sass into CSS & auto-inject into browsers
gulp.task("sass", function() {
return gulp
.src("/scss/*.scss")
.pipe(sass())
.pipe(gulp.dest("/css"))
.pipe(browserSync.stream());
});
gulp.task("default", ["serve"]);
from gulp combining tasks into default command
No comments:
Post a Comment