目标:编写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。
 
 
 

使用gulp脚本配合TypeScript开发的更多相关文章

  1. gulp自己主动化任务脚本在HybridApp开发中的使用

    眼下做前端开发的同学可能都熟悉grunt.fis之类的自己主动化构建工具.事实上在HybridApp开发中我们也能够使用这些工具来简化我们的工作.gulp就是一个比grunt,fis都先进的构建工具. ...

  2. VSCode搭建node + typescript开发环境

    我们一起来喜欢TypeScript 现在写js不用TypeScript,伦家可能会觉得你是外星人. 是的,TypeScript很大程度增强了代码的可读性,可跟踪性,可维护性和减少了bug. 那么没有理 ...

  3. 使用Visual Studio Code搭建TypeScript开发环境

    使用Visual Studio Code搭建TypeScript开发环境 1.TypeScript是干什么的 ? TypeScript是由微软Anders Hejlsberg(安德斯·海尔斯伯格,也是 ...

  4. 使用TypeScript开发一个在线记事本,支持离线存储

    先贴上源码传送门: https://github.com/flowforever/yaryin.note 记事本网址: http://yindoc.com , 井号后面写你喜欢的文件名即可. 最近在研 ...

  5. TypeScript开发环境搭建(Visual studio code)

    使用Visual Studio Code搭建TypeScript开发环境 1.TypeScript是干什么的 ? TypeScript是由微软Anders Hejlsberg(安德斯·海尔斯伯格,也是 ...

  6. 使用Visual Studio Code + Node.js搭建TypeScript开发环境

    Visual Studio Code搭建Typescript开发环境 —— 相关文章: http://www.cnblogs.com/sunjie9606/p/5945540.html [注意:这里仅 ...

  7. 新石器时代码农的Typescript开发总结

    如果评定前端在最近五年的重大突破,Typescript肯定能名列其中,重大到各大技术论坛.大厂面试都认为Typescript应当是前端的一项必会技能.作为一名消息闭塞到被同事调侃成"新石器时 ...

  8. Typescript开发学习总结(附大量代码)

    如果评定前端在最近五年的重大突破,Typescript肯定能名列其中,重大到各大技术论坛.大厂面试都认为Typescript应当是前端的一项必会技能.作为一名消息闭塞到被同事调侃成"新石器时 ...

  9. 如何用TypeScript开发微信小程序

    微信小程序来了!这个号称干掉传统app的玩意儿虽然目前处于内测阶段,不过目前在应用号的官方文档里已经放出了没有内测号也能使用的模拟器了. 工具和文档可以参考官方文档:https://mp.weixin ...

随机推荐

  1. Mysqlbinlog使用

    Mysqlbinlog使用   1.binlog日志打开方法 在my.cnf这个文件中加一行(Windows为my.ini).#vi /etc/my.cnf[mysqld]log-bin=mysqlb ...

  2. MDF文件数据恢复

  3. SSL协议与数字证书原理

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html 内部邀请码:C8E245J (不写邀请码,没有现金送) 国 ...

  4. C++转义字符使用

    编码过程中字符串可能过长,这通常须要换行,对于换行转义字符\ ,使用时要保证\后无空格,否则会出现"error C2017:非法的转义字符 "错误 如 //  ''\"后 ...

  5. 在Flash Builder或者Eclipse统计代码行数的方法

    在Flash  Builder或者Eclipse统计代码行数的方法如下图菜单栏--搜索--搜索文件

  6. Swift学习笔记六

    集合类型(Collection Type) Swift提供三种主要的集合类型:数组(array).集合(set).字典(dictionary).数组是有序的值序列,集合是无序的值序列,字典是无序的键值 ...

  7. HDU 5515 Game of Flying Circus 二分

    Game of Flying Circus Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem ...

  8. hihocoder #1223 : 不等式 水题

    #1223 : 不等式 Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://hihocoder.com/problemset/problem/1223 ...

  9. Key Task

    Problem Description The Czech Technical University is rather old - you already know that it celebrat ...

  10. xampp

    Fatal error: Class 'kernel' not found in C:\xampp\htdocs\shopex\install\install.core.php on line 10 ...