使用gulp腳本配合TypeScript開發

目標：編寫TypeScript時，保存即生成js文件。

 

使用npm安裝以下組件

• gulp
• gulp-rename
• through-gulp
• gulp-typescript

 

編寫gulpfiles.js

 

var gulp = require("gulp");

var rename = require("gulp-rename");

var through = require("through-gulp");

var ts = require("gulp-typescript");

var gutil = require("gulp-util");

var fs = require("fs");

var path = require("path");

 

var taskFun = function (cb, filename)

{

    gulp.src(filename ? filename : ["**/*.ts", "!**/node_modules/**"])

        .pipe(through(function (file, encoding, callback)

        {

            gutil.log("[ts2js] " + file.path);

            this.push(file);

            callback();

        }))

        .pipe(ts())

        .pipe(rename(function (path)

        {

            path.ext = ".js";

        }))

        .pipe(gulp.dest(filename ? path.dirname(filename) : "."));

};

 

gulp.task("default", taskFun);

 

gulp.watch(["**/*.ts", "!**/node_modules/**"], function (e)

{

    if (fs.existsSync(e.path))

    {

        var stat = fs.statSync(e.path);

        if (stat.isFile())

            taskFun(null, e.path);

    }

});

 

 

執行腳本時把所有的*.ts文件生成一次，然后檢測到有修改時生成對應的js。

只是當前gaze的Bug還比較多，在使用中經常掉鏈子，而gulp.watch()依賴此庫，只能發現掛掉就重新運行下gulp。