使用gulp-webpack组装打字稿

Question

有一个测试项目,其结构:

它是文件*.ts:

////// greeter.ts
import {ActionsCollection} from "./actionsCollection";
class Greeter extends ActionsCollection{

}
var greeter = new Greeter();
alert(greeter.greet("Hello, world!"));

////// actionsCollection.ts

export class ActionsCollection{

    public say (){

    }

    public greet(greeting :string) {
        return "<h1>"+greeting+"</h1>";
    }
}

///// newTS.ts

export class NewTS{
    public foo (){
        return "<h1>foo</h1>";
    }
}

这是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']);
});

所有这一切都被编译成单个文件main.js,但编译以一种奇怪的方式工作.例如,当我更改actionsCollection.ts文件时,并不总是触发编译.如果我创建一个新new.ts文件,如果没有将其导入greeter.ts或者actionsCollection.ts,那么他就不会落入公共文件中 - main.js.这很糟糕,因为这些文件是存在的,并且可以隐式调用它们的方法.

怎么做正确的事情？你可以帮我编辑我的gulpfile吗？