I am trying to create a gulpfile.js to compile scss to css and JS components to a main JS file. But it's not working properly.
The issues i am facing, when I run the command gulp:

1. It doesn't compile JS components to a main JS file.
2. It compiles SCSS but when i save any file, the git-bash terminal executing files infinitely, here is the screenshot:
   

Here is my gulpfile.js:

"use strict";

const source = 'assets/';

// Load Modules
const { src, dest, watch, series } = require('gulp');
const sass = require('gulp-sass')(require('sass'));
const postcss = require('gulp-postcss');
const cssnano = require('cssnano');
const terser = require('gulp-terser');
const browsersync = require('browser-sync').create();

// Scss Task
function scssTask() {
    return src(`${source}/scss/zaincss.scss`)
    .pipe(sass())
    .pipe(postcss([cssnano()]))
    .pipe(dest(`${source}/css`));
}

// Javascript Task
function jsTask() {
    return src(`${source}/js/scripts/*.js`)
    .pipe(terser())
    .pipe(dest(`${source}/js/scripts/`));
}

// BrowserSync Tasks
function browserSyncServe(done) {
    browsersync.init({
        server: {
            baseDir: '.'
        },
        injectChanges: true
    });
    done()
}

function browserSyncReload(done) {
    browsersync.reload();
    done();
}

// Watch Task
function watchTask() {
    watch('*.html', browserSyncReload);
    watch(['assets/scss/**/*.scss', 'assets/js/**/*.js'], series(scssTask, jsTask, browserSyncReload));
}

// Default Gulp Task
exports.default = series(
    scssTask, jsTask, browserSyncServe, watchTask
);

I have googled a lot, but i am stuck. Please help me.