angular2 gulp watch browserSync

gulpfile.js

/// <binding AfterBuild='build' Clean='clean' />
 
"use strict";

var path = require('path');
var gulp = require('gulp');
var del = require('del');
var typescript = require('gulp-typescript');
var inlineNg2Template = require('gulp-inline-ng2-template');
var sourcemaps = require('gulp-sourcemaps');
var browserSync = require('browser-sync').create();

//var fs = require('fs');
//const vinylFile = require('vinyl-file');
var project = require("./project.json");
var webroot = "./" + project.webroot + "/";
   

	
var config = {
    libBase: 'node_modules',
    lib: [
        require.resolve('bootstrap/dist/css/bootstrap.css'),
        require.resolve('bootstrap-rtl/dist/css/bootstrap-rtl.css'),
        path.dirname(require.resolve('bootstrap/dist/fonts/glyphicons-halflings-regular.woff')) + '/**',
        //require.resolve('traceur/bin/traceur-runtime.js'),
        //require.resolve('es6-module-loader/dist/es6-module-loader-sans-promises.js'),

        require.resolve('es6-shim/es6-shim.js'),
        require.resolve('es6-promise/dist/es6-promise.js'),

        require.resolve('angular2/bundles/angular2-polyfills.js'),
        require.resolve('systemjs/dist/system.src.js'),
        require.resolve('rxjs/bundles/Rx.js'),
        require.resolve('angular2/bundles/angular2.dev.js'),
        require.resolve('angular2/bundles/router.dev.js'),
        require.resolve('angular2/bundles/http.dev.js'),

         

        require.resolve('jquery/dist/jquery.js'),
        require.resolve('bootstrap/dist/js/bootstrap.js')
      
    ]
};

gulp.task('build.lib', function () {
    return gulp.src(config.lib, { base: config.libBase })
        .pipe(gulp.dest(webroot + 'lib'));
});

gulp.task('build', ['build.lib'], function () {
    var tsProject = typescript.createProject('./tsconfig.json', { typescript: require('typescript') });
    var tsSrcInlined = gulp.src([webroot + '**/*.ts'], { base: webroot })
        .pipe(inlineNg2Template({ base: webroot }));
    return tsSrcInlined
        .pipe(sourcemaps.init())
        .pipe(typescript(tsProject))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest(webroot));
});

 
gulp.task('clean', function () {
    return del([webroot + 'lib']);
});

gulp.task('default', ['build']);
 
gulp.task('watch', function() {
	
	  browserSync.init({
        proxy: "http://localhost:47931"
    });
	
	 

  gulp.watch( webroot + '**/*.ts', function(event) {
	    console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');

	  var tsProject = typescript.createProject('./tsconfig.json', { typescript: require('typescript') });
 
	 	 gulp.src([event.path], { base: webroot })
			.pipe(inlineNg2Template({ base: webroot }))
			.pipe(sourcemaps.init())
			.pipe(typescript(tsProject))
			.pipe(sourcemaps.write())
			.pipe(gulp.dest(webroot));
	
       browserSync.reload() ;
});
});





gulp.task('watchbuild', function () {
    var tsProject = typescript.createProject('./tsconfig.json', { typescript: require('typescript') });
    var tsSrcInlined = gulp.src([webroot + '**/*.ts'], { base: webroot })
        .pipe(inlineNg2Template({ base: webroot }));
    return tsSrcInlined
        .pipe(sourcemaps.init())
        .pipe(typescript(tsProject))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest(webroot));
});

 


gulp.task('watch2', function() {
    gulp.watch(webroot + '**/*.ts', ['watchbuild']);
});