无法弄清楚如何向gulp.js添加服务/连接

Question

我一直在研究.net mvc / angular 5项目中的一些错误，并且每次进行更改时都不得不构建gulp文件（对于角度），这令人沮丧，因此我一直在尝试为serve /创建简单的实现连接到我现有的gulpfile，但是我还没有找到任何文件。。我希望获得一些帮助。

这是我的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：...”，依此类推，但是当我转到该地址时，它给了我“无法获取”