Question

在Visual Studio 2015中，我正在跟踪对TS文件所做的更改，以便我可以复制生成的JS文件并将其输出到我的wwwroot目录。但是，每当我对单个TS文件进行更改时，所有这些文件都会构建并输出到wwwroot文件夹。我应该在这里更改什么才能将新的JS文件复制到wwwroot？

我使用 gulp-watch 来跟踪文件更改，并使用 gulp-newer 来过滤新文件。

gulp.task('min:site:js', function () {
return gulp
  .src('Contents/Scripts/**/*.js', { relative: true })
  .pipe(newer('wwwroot/js/'))
  .pipe(gulp.dest('wwwroot/js/'))
  .pipe(uglify())
  .pipe(rename({ extname: '.min.js' }))
  .pipe(gulp.dest('wwwroot/js/'));
});

gulp.task('watch:ts', function () {
   gulp.watch('Contents/Scripts/**/*.ts', ['min:site:js']);
});

Answer 1

gulp.watch 有两种主要形式。两者都返回发出更改事件的EventEmitter。第一个接受一个glob，一个可选的选项对象，以及一个任务数组作为它的参数。

gulp.watch('Contents/Scripts/**/*.ts', ['min:site:js']);

简单地说，当glob匹配的任何文件发生变化时，运行任务。在上面的代码块中，当Contents/Scripts/**/*.ts子文件夹中扩展名为.ts的任何文件发生更改时，将针对这些文件运行任务min:site:js。

第二种形式采用glob，一个可选的选项对象，以及一个在拾取更改时运行的可选回调。

有关更多信息，请参阅api docs

使用 gulp-typescript 在更改时编译 .ts 文件这里有例子：

var gulp = require('gulp');
var ts = require('gulp-typescript');
var merge = require('merge2');

var tsProject = ts.createProject({
    declaration: true,
    noExternalResolve: true
});

gulp.task('scripts', function() {
    var tsResult = gulp.src('lib/*.ts')
                    .pipe(ts(tsProject));

    return merge([ // Merge the two output streams, so this task is finished         when the IO of both operations are done. 
        tsResult.dts.pipe(gulp.dest('release/definitions')),
        tsResult.js.pipe(gulp.dest('release/js'))
    ]);
});
gulp.task('watch', ['scripts'], function() {
    gulp.watch('lib/*.ts', ['scripts']);
});

https://www.npmjs.com/package/gulp-typescript

Gulp-watch打字稿文件并仅发布已更改的文件

1 个答案: