I come to you for help. I am using the gulp and browser-sync to automate my tasks: compiling sass, restarting the development server on every change, and checking the changes in the browser. I just want to make it faster. The problem is when I run gulp (I also use gulp-nodemon) it just runs nodemon but browser-sync doesn't run and the other tasks don't run either. If I run each task separately, they work, but all together by default with gulp, they don't work. If you want to help me, I will always appreciate it.
This is my code
const gulp = require('gulp'),
sass = require('gulp-sass'),
autoprefixer = require('gulp-autoprefixer'),
browserSync = require('browser-sync').create(),
nodemon = require('gulp-nodemon'),
watch = require('gulp-watch');
gulp.task('scss', () => {
let stream = gulp
.src('./src/scss/*/*.scss')
.pipe(sass({outputStyle: 'expanded',}))
.pipe(autoprefixer({ versions: 'last 2 browsers', }))
.pipe(gulp.dest('./src/public/css'))
.pipe(browserSync.stream());
return stream;
});
gulp.task('nodemon', cb => {
let started = false;
return nodemon({
script: './src/index.js',
ext: 'ejs js',
ignore: ['gulpfile.js'],
}).on('start', () => {
if (!started) {
cb();
started = true;
}
});
});
gulp.task('browser-sync', gulp.series('nodemon'), () => {
browserSync.init({
proxy: 'http://localhost:3000',
open: false,
files: ['public/**/*.js'],
browser: 'google chrome',
port: 3000,
});
});
gulp.task('default', gulp.series('browser-sync'), () => {
gulp.watch('./src/views/*/*.ejs').on('change', browserSync.reload());
gulp.watch('./src/public/*/*.js').on('change', browserSync.reload());
gulp.watch('./src/public/css/*/*.css').on('change', browserSync.stream());
gulp.watch('./src/scss/*/*.scss', gulp.series('scss'));
});
This has three arguments:
gulp.task('browser-sync', gulp.series('nodemon'), () => {
in gulp v4+ you can only have two arguments, so change that to
gulp.task('browser-sync', gulp.series('nodemon', () => {
and same with
gulp.task('default', gulp.series('browser-sync', () => {
)
to add to the ends of those functions too, like }));