Default Setup for Visual Studio/TaskRunner

gulpfile.js

/// <binding BeforeBuild='build' />
const { series, parallel } = require('gulp');

var path = require('path'),
    gulp = require('gulp'),
    gp_clean = require('gulp-clean'),
    gp_sass = require('gulp-sass')(require("sass")),
    sourcemaps = require('gulp-sourcemaps'),
    uglify = require("gulp-uglify"),
    buffer = require('vinyl-buffer'),
    source = require('vinyl-source-stream'),
    rename = require("gulp-rename"),
    browserify = require("browserify"),
    tSt = require("gulp-typescript");


const basePath = path.resolve(__dirname, "wwwroot");
const modulePath = path.resolve(__dirname, "node_modules");

const tsProject = tSt.createProject(path.resolve(basePath, 'tsconfig.json'));

var srcPaths = {
    lib: [
        {
            src: path.resolve(modulePath, 'bootstrap/dist/**/*'),
            dest: path.resolve(basePath, 'lib/bootstrap/')
        },
        {
            src: path.resolve(modulePath, '@fortawesome/fontawesome-free/**/*'),
            dest: path.resolve(basePath, 'lib/fontawesome/')
        }
    ],
    srcJs: [
        path.resolve(basePath, 'src/tuxboard.js')
    ],
    srcSass: [
        path.resolve(basePath, 'scss/site.scss')
    ]
};

var destPaths = {
    publicCss: path.resolve(basePath, 'css'),
    publicJs: path.resolve(basePath, 'js')
};


function testTask(done) {
    console.log('Hello World! We finished a task!');
    done();
}

/* Tasks */

/* Copy Libraries to their location */
const copyLibraries = (done) => {
    srcPaths.lib.forEach(item => {
        return gulp.src(item.src)
            .pipe(gulp.dest(item.dest));
    });
    done();
}

const cleanLibraries = (done) => {
    srcPaths.lib.forEach(item => {
        return gulp.src(item.dest + '**')
            .pipe(gp_clean());
    });
    done();
}

/* TypeScript */
const ts_transpile = (done) => {
    return tsProject.src()
        .pipe(tsProject())
        .pipe(gulp.dest(path.resolve(basePath, 'src')));
}

const ts_clean = (done) => {
    if (srcPaths.srcJs.length > 0) {
        gulp.src(srcPaths.srcJs, { allowEmpty: true })
            .pipe(gp_clean({ force: true }));
    }
    done();
}

/* JavaScript */
const js_bundle_min = (done) => {
    srcPaths.srcJs.forEach(file => {

        const b = browserify({
            entries: file, // Only need initial file, browserify finds the deps
            debug: true, // Enable sourcemaps
            transform: [['babelify', { 'presets': ["@babel/preset-env", "@babel/preset-react"] }]]
        });

        b.bundle()
            .pipe(source(path.basename(file)))
            .pipe(rename(path => {
                path.basename += ".min";
                path.extname = ".js";
            }))
            .pipe(buffer())
            .pipe(sourcemaps.init({ loadMaps: true }))
            .pipe(uglify())
            .pipe(sourcemaps.write())
            .pipe(gulp.dest(destPaths.publicJs));

        done();
    });
}

const js_clean = (done) => {
    gulp.src(path.resolve(destPaths.publicJs, '**/*.js'), { read: false })
        .pipe(gp_clean({ force: true }));
    done();
}


/* SASS/CSS */
const sass_clean = (done) => {
    gulp.src(destPaths.publicCss + "**/*", { read: false })
        .pipe(gp_clean({ force: true }));
    done();
}

const sass_build = (done) => {
    gulp.src(srcPaths.srcSass)
        .pipe(gp_sass({ outputStyle: 'compressed' }))
        .pipe(rename({
            suffix: '.min'
        }))
        .pipe(gulp.dest(destPaths.publicCss));
    done();
}

exports.build = series(
    cleanLibraries,
    sass_clean,
    ts_clean,
    js_clean,
    parallel(
        copyLibraries,
        series(
            ts_transpile,
            js_bundle_min
        ),
        sass_build
    )
);

exports.clean = series(
    cleanLibraries,
    sass_clean,
    ts_clean,
    js_clean
);

package.json

{
  "name": "default",
  "version": "1.0.0",
  "private": true,
  "devDependencies": {
    "@babel/core": "^7.22.1",
    "@babel/preset-env": "^7.22.4",
    "@babel/preset-react": "^7.22.3",
    "@fortawesome/fontawesome-free": "^6.4.0",
    "@popperjs/core": "^2.11.8",
    "@types/bootstrap": "^5.2.6",
    "@types/gulp": "^4.0.11",
    "babel-preset-env": "^1.7.0",
    "bootstrap": "^5.3.0",
    "del": "^7.0.0",
    "gulp": "^4.0.2",
    "gulp-babel": "^8.0.0",
    "gulp-browserify": "^0.5.1",
    "gulp-clean": "^0.4.0",
    "gulp-rename": "^2.0.0",
    "gulp-sass": "^5.1.0",
    "gulp-sourcemaps": "^3.0.0",
    "gulp-typescript": "^6.0.0-alpha.1",
    "gulp-uglify": "^3.0.2",
    "sass": "^1.62.1",
    "typescript": "^5.1.3",
    "vinyl-buffer": "^1.0.1",
    "vinyl-paths": "^5.0.0",
    "vinyl-source-stream": "^2.0.0"
  },
  "dependencies": {
    "nvm": "0.0.4",
    "rebuild": "^0.1.2"
  }
}