не могу понять, как добавить подачу / подключение к gulp.js

Question

Я работал над некоторыми ошибками в проекте .net mvc / angular 5, и его разочаровывает необходимость создавать файл gulp (для angular) каждый раз, когда я вносил изменения, поэтому я пытался найти простую реализацию для serve / подключиться к моему существующему gulpfile, но я не нашел ни одного .. Буду признателен за помощь.

Это мой гулфайл.

/*
This file is the main entry point for defining Gulp tasks and using Gulp plugins.
Click here to learn more. https://go.microsoft.com/fwlink/?LinkId=518007
*/

var gulp = require('gulp'),
    tsc = require('gulp-typescript'),
    Builder = require('systemjs-builder'),
    tslint = require('gulp-tslint'),
    sourcemaps = require('gulp-sourcemaps'),
    tscConfig = require('./tsconfig.json'),
    inlineNg2Template = require('gulp-inline-ng2-template'),
    concat = require('gulp-concat');


gulp.task('inline-templates',
    () => {
        return gulp.src('app/**/*.ts')
            .pipe(inlineNg2Template({ base: 'app/', useRelativePaths: true, indent: 0, removeLineBreaks: true }))
            .pipe(tsc(tscConfig.compilerOptions))
            .pipe(gulp.dest('dist/app'));
    });

gulp.task('bundle-app', gulp.series(['inline-templates'], () => {
    this.displayName = 'bundle-app-inside';
    // optional constructor options
    // sets the baseURL and loads the configuration file
    var builder = new Builder('', './dist-systemjs.config.js');

    return builder
        .bundle('dist/app/**/* - [@angular/**/*.js] - [rxjs/**/*.js]', 'bundles/app.bundle.js', { minify: true })
        .then(function () {
            console.log('Build complete');
        })
        .catch(function (err) {
            console.log('Build error');
            console.log(err);
        });
}));

gulp.task('bundle-dependencies', gulp.series(['inline-templates'], function () {
    // optional constructor options
    // sets the baseURL and loads the configuration file
    var builder = new Builder('', 'dist-systemjs.config.js');

    return builder
        .bundle('dist/app/**/*.js - [dist/app/**/*.js]', 'bundles/dependencies.bundle.js', { minify: true })
        .then(function () {
            console.log('Build complete');
        })
        .catch(function (err) {
            console.log('Build error');
            console.log(err);
        });
}));

gulp.task('bundle', gulp.series(['bundle-app', 'bundle-dependencies']));

///////
gulp.task('lint',
    () => {
        return gulp.src('app/**/*.ts')
            .pipe(tslint({ formatter: 'prose' }))
            .pipe(tslint.report());
    });

gulp.task('compile:app',
    () => {
        return gulp.src('app/**/*.ts')
            .pipe(sourcemaps.init())
            .pipe(tsc(tscConfig.compilerOptions))
            .pipe(sourcemaps.write('.'))
            .pipe(gulp.dest('dist/js'));
    });

gulp.task('compile', gulp.series(['lint', 'compile:app']));

var vendorJS = [
    'node_modules/core-js/client/shim.min.js',
    'node_modules/zone.js/dist/zone.js',
    'node_modules/systemjs/dist/system.src.js'
];

gulp.task('vendor-js',
    () => {
        return gulp.src(vendorJS)
            .pipe(concat('vendor.js'))
            .pipe(gulp.dest('bundles/'));
    });

gulp.task('build', gulp.series(['compile', 'bundle', 'vendor-js']));



//var serve = require('gulp-serve');

//gulp.task('serve', serve('public'));
//gulp.task('serve-build', serve(['public', 'build']));
//gulp.task('serve-prod', serve({
//    root: ['public', 'build'],
//    port: 80,
//    middleware: function (req, res) {
//        // custom optional middleware
//    }
//}));

var connect = require('gulp-connect');

gulp.task('connect', function () {
    connect.server({
        root: 'app/**/*.ts',
        port: 8888
    });
});
gulp.task('serve', gulp.series(['lint', 'connect']));

Последние два блока (начиная с закомментированного) - это те, которые я пробовал. Оба блока, когда я их пробовал, просто дают мне «подключенный к Localhost: ...» и так далее, но когда я перехожу по адресу, он дает мне «Cannot GET»