Gulp-watch quells typescript errors

2019-09-08 08:10发布

问题:

I am trying to set up a watch in my gulpfile that only builds changed typescript files, the problem is that it watches an builds fine, but all console output is quelled it seems, so I am not seeing any typescript compile errors on the command line.

This is the relevant parts of my gulpfile

var watch=require('gulp-watch');
var ts=require('gulp-typescript');

var tsProj = ts.createProject('tsconfig.json');

gulp.task('watch-typescript', function(){
  watch('app/**/*.ts')
  .pipe(ts(tsProj))
  .pipe(gulp.dest('app'));
});

gulp.task('default', function(){
  gulp.src('app/**/*.ts')
  .pipe(ts(tsProj))
  .pipe(gulp.dest('app'));
});

If I create a typescript file that has errors in it and just run the default task the errors are reported fine, but when using the watch task, I see no errors (it still tries to build (and fails of course) and all that).

I have tried this syntax, but also .pipe(watch('app/**/*.ts')) syntax, and also tried the watch('app/**/*.js', function(files){...}) syntax, but all different solutions give the same result, when the gulp-watch is on, there is no console output from other tools.

I actually saw the same thing when using the .pipe(watch('app/**/*.ts')) in a default task, where there were a lot more things going on (several tasks triggered for sass builds, etc), and as soon as the code reached the watch, all other output to the console disappeared.

So my question is, what am I missing here, this seems to be so problematic that it would make no one use gulp-watch, but still I don't find any info about this when googling, so I must be missing something.

回答1:

We are using following tasks to build typescript (default task is watching for changes and compile .ts into single file with embedded source map). Errors are present in output during watch task works.

var gulp = require("gulp"),
    concat = require("gulp-concat"),
    ts = require("gulp-typescript"),
    sourcemaps = require("gulp-sourcemaps");

gulp.task("typescript:sources", function () {
    var tsResult = gulp.src(["./sources/**/*.ts"])
       .pipe(sourcemaps.init())
       .pipe(ts({
           target: "ES5",
           noImplicitAny: false
       }));

    return tsResult.js
        .pipe(concat("dist.scripts.js"))
        .pipe(sourcemaps.write({ sourceRoot: "sources" }))
        //Source map is a part of generated file
        .pipe(gulp.dest("./dist"));
});

gulp.task("add_ts_watch:sources", function () {
    gulp.watch(["./sources/**/*.ts"], ["typescript:sources"])
});

gulp.task('default', ['add_ts_watch:sources']);

Hope this helps.