javascript - Assembling the typescript with gulp-webpack -

there test-project, structure:

it files * .ts:

////// greeter.ts import {actionscollection} "./actionscollection"; class greeter extends actionscollection{  } var greeter = new greeter(); alert(greeter.greet("hello, world!"));  ////// actionscollection.ts  export class actionscollection{      public (){      }      public greet(greeting :string) {         return "<h1>"+greeting+"</h1>";     } }  ///// newts.ts  export class newts{     public foo (){         return "<h1>foo</h1>";     } } 

it gulpfile:

var gulp = require('gulp'); var debug = require('gulp-debug'); var webpack = require('gulp-webpack'); gulp.task('default', function() {     return gulp.src('ts/greeter.ts')         .pipe(webpack({             output: {                 filename: 'main.js'             },             resolve: {                 extensions: ['', '.webpack.js', '.web.js', '.ts', '.js']             },             module: {                 loaders: [                     { test: /\.ts$/, loader: 'ts-loader' }                 ]             }         }))         .pipe(debug({title:'src'}))         .pipe(gulp.dest('js/')); });  gulp.task('watch', ['default'], function() {     gulp.watch('ts/**/*.ts', ['default']); }); 

all compiled single file main.js, compilation works in strange way. example when changed actionscollection.ts file, compilation not triggered. , if create new new.ts file, , if not import within greeter.ts or actionscollection.ts, not fall common file - main.js. it's bad, because such files exist , methods may invoked implicitly.

how right thing? can me edit gulpfile?